Is there a way I can conduct a search that includes both uppercase and lowercase characters simultaneously?

My current task is to create a search function that can search for elements in both lower and upper case, regardless of the case typed in by the user.

I have attempted to implement a search feature that covers both upper and lower case scenarios, but it seems to not be functioning correctly. Any suggestions to fix this would be greatly appreciated.

search(searchValue) {
    if (searchValue != null && searchValue != "") {
      var searchItem = searchValue;
      var allOppData = this.stagesWiseOpportunitiesData;

      var filtered = _.mapValues(allOppData, statuses =>
        _.filter(statuses, statusT =>
          _.some(statusT, T => _.includes(T, searchItem))
        )
      );
      this.stagesWiseOpportunitiesData = filtered;
      let stages = this.opportunitiesStateReason;
      stages.forEach(element => {
        let num = this.stagesWiseOpportunitiesData[element.orderData].reduce(
          function(sum, value) {
            return sum + value.expected_revenue;
          },
          0
        );
        element.totalExpectedRevenue = num.toFixed(2);
      });
    } else {
      this.stagesWiseOpportunitiesData = this.stagesWiseOpportunitiesDataCopy;
      let stages = this.opportunitiesStateReason;
      stages.forEach(element => {
        let num = this.stagesWiseOpportunitiesData[element.orderData].reduce(
          function(sum, value) {
            return sum + value.expected_revenue;
          },
          0
        );
        element.totalExpectedRevenue = num.toFixed(2);
      });
    }
  }
}

Answer №1

Make sure to include the return statement in the search function for proper functionality.

REMINDER: Remember to return a value for the main search function.

function search(searchValue) {
    if (searchValue != null && searchValue != "") {
        var searchItem = searchValue;
        var allOppData = this.stagesWiseOpportunitiesData;

        var filtered = _.mapValues(allOppData, statuses =>
            _.filter(statuses, statusT =>
                _.some(statusT, T => _.includes(T, searchItem))
            )
        );
        this.stagesWiseOpportunitiesData = filtered;
        let stages = this.opportunitiesStateReason;
        return stages.forEach(element => {
            let num = this.stagesWiseOpportunitiesData[element.orderData].reduce(
                function(sum, value) {
                    return sum + value.expected_revenue;
                },
                0
            );
            element.totalExpectedRevenue = num.toFixed(2);
        });
    } else {
        this.stagesWiseOpportunitiesData = this.stagesWiseOpportunitiesDataCopy;
        let stages = this.opportunitiesStateReason;
        return stages.forEach(element => {
            let num = this.stagesWiseOpportunitiesData[element.orderData].reduce(
                function(sum, value) {
                    return sum + value.expected_revenue;
                },
                0
            );
            element.totalExpectedRevenue = num.toFixed(2);
        });
    }
}

console.log(search("Test"))

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Customizing the background-color of a div to match the primary theme color using Angular 2 Material

I'm currently implementing a theme from the Angular 2 Material library. I have successfully applied the theme colors to material components such as buttons and toolbars using color="primary". However, I am facing difficulties in theming a div element. ...

Is there a way for me to retrieve the widths of all child elements within an HTML document?

I have been working on a JavaScript (jQuery) function to calculate the maximum width of all child and children's-child elements within a specific div element. Here is the code I have written so far: function setBodyMinWidth(name){ var max = 0; $(nam ...

The changing of colors does not function properly when clicked in JavaScript

I am having an issue with a drop-down list that offers two options: blue and green. When I select blue and click on the text input field, its background color alternates between blue and black (the default text field color). The same applies when I choose ...

What is the best way to display individual progress bars for each file uploaded using ajax?

Firstly, I want to express my gratitude for taking the time to read this. Secondly, I kindly ask you to revisit the title... I am not seeking assistance with a single progress bar as there is ample documentation available online for that. Instead, I am in ...

Issue with Vue Checkbox not functioning properly upon being mounted in Edge browser

Currently, I am developing a Vue page with a checkbox that needs to read a value from a cookie upon mounting. However, I have observed that in the Edge browser, the checkbox does not get set correctly even though the Mounted function is definitely being ca ...

Adding an overlay to a material UI table row: Step by step guide

My code is rendering a row in the following format: `<TableRow key={row.name} > <TableCell>{row.empId}</TableCell> <TableCell>{row.userId}</TableCell> <TableCell>{row.name}</TableCell> <TableCell>{r ...

I am looking to implement a function in JavaScript that will prevent the next button from being enabled until all options

I have a total of 6 dropdown menus along with a next button and previous button. I want the next button to be disabled until all 6 dropdown menus are filled out. Once all 6 dropdown menus are filled, the "next" button should become enabled. Below is the c ...

The export 'ChartObject' is not available in highcharts

Trying to integrate highcharts into my Angular 4 project has been a bit challenging as I keep encountering the following error: highcharts has no exported member 'ChartObject' I have experimented with different options such as angular-highchart ...

Injecting Vibrant Lines into Browser Using three.js

My current project involves drawing colored lines in a browser without using meshes. I am retrieving data from a MySQL database where geometry and other attributes are stored, and then converting this data into text blocks that create individual line objec ...

Using Javascript within AEM to update a class upon checkbox selection

I need assistance targeting the 'horizontal-video' class within a div in an AEM component. I am attempting to add a second class called 'flipped' to the div if the author clicks on a checkbox with the ID of 'coral-id-540'. Unf ...

Using the expect statement within a Protractor if-else block

My script involves an if-else condition to compare expected and actual values. If they do not match, it should go to the else block and print "StepFailed". However, it always executes the if block and the output is "step passed" even when expected does not ...

Place 4 divs within 2 divs, with one aligned to the left and the other to the right

I'm currently working on a small project using Angular 2 for an experiment, where I need to place 4 divs, each containing an image, within 2 divs. However, all the divs (with images) are stacked vertically instead of being placed next to each other, ...

TypeScript: When using an API, it consistently returns an empty object with the type { [key: string]: any }

Every time I try to fetch data from the API, it always comes back empty. See example code snippet below: interface DataStore { [key: string]: any, } static GetData = async (req: Request, res: Response): Promise<Response> => { let obj: Dat ...

Explore a JSON array within another JSON array

Here is a JSON format that I have: { "Project [id=1, dateDebut=2017-01-13, dateFin=2017-01-18, description=qsd, sponsor=qsd ]" : [ {"id":1,"title":"qsd ","description":"qsdqsd","dateFin":"2017-01-26"}, {"id":2,"title":"sss ","descriptio ...

What are the potential drawbacks of using this alternative method instead of `useCallback` in React to prevent unnecessary re-renders of children components?

While exploring some code, I stumbled upon an alternative method to prevent function recreation during renders compared to the official useCallback hook. This method seems to offer certain benefits over useCallback, but I am interested to know if there are ...

Combining Date and Time in Javascript: A Guide

As a JavaScript beginner, I am struggling with combining date and time pickers. Despite finding similar questions, I have not yet found the solution I need. I have two inputs: one for the datePicker and another for the timePicker. <form> <div clas ...

Struggling to successfully pass data between pages using JSON

I'm currently working on HTML code for a view cart page where I display an item name. My goal is to be able to transfer this data, along with others later on, to a different HTML page that will automatically generate a list of multiple items with pric ...

Achieving successful content loading through AJAX using the .load function

Our website features a layout where product listings are displayed on the left side, with the selected product appearing on the right side (all on the same page). Initially, when the page loads, the first product is shown on the right. Upon clicking a new ...

Error in Node.js (NPM Error)

Recently, I purchased a VPS running Ubuntu 14.4 and successfully installed Node.js 1.4. However, when attempting to run my script (node tradebot.js), I encountered the following error message! :-/ module.js:327 throw err; ^ Error: Cannot find ...

checkbox causing the button to appear empty

Due to the inability of a ngIf and ngFor to coexist, I added an ng-container to facilitate the loop. However, after making this change, nothing seems to be working as expected without any clear reason. Below is the code snippet that is causing trouble: Vi ...