0

I want to add conditions in JavaScript filter() method dynamically.

I have the code below:

let condition = ''; let a = ['empEmail', 'employeeAction', 'transactionNo', 'deviceListName', 'projectName']; if (this.selectedEmployeeAlias != undefined) { condition += '&& a => a.empEmail === this.selectedEmployeeAlias'; } if (this.employeeStatusList != undefined) { condition += '&& a.employeeAction === this.employeeStatusList' } if (this.selectedTransactionNo != undefined) { condition += '&& a.transactionNo === this.selectedTransactionNo'; } if (this.selectedDeviceList != undefined) { condition += ' && a.deviceListName == this.selectedDeviceList'; } if (this.selectedProjectName != undefined) { condition += '&& a.projectName == this.selectedProjectName'; } var finalCondition = condition.substring(2, condition.length); var fArray = arrayDetails.filter(finalCondition); 

The code is returning an error as:

finalCondition is not a function.

Could you please let me know how can I add conditions to filter() dynamically.

2
  • 2
    Its because "finalCondition" is a string returned by "substring", the filter routine is expecting a function to be passed to it. See w3schools.com/jsref/jsref_filter.asp Commented Jul 4, 2018 at 10:49
  • 1
    please add the sample data, you have and what this is pointing to. Commented Jul 4, 2018 at 10:58

3 Answers 3

2

You could take an array of functions with conditions. Then iterate with every.

var conditions = []; if (this.selectedEmployeeAlias !== undefined) { conditions.push(a => a.empEmail === this.selectedEmployeeAlias); } if (this.employeeStatusList !== undefined) { conditions.push(a => a.employeeAction === this.employeeStatusList); } if (this.selectedTransactionNo !== undefined) { conditions.push(a => a.transactionNo === this.selectedTransactionNo); } if (this.selectedDeviceList !== undefined) { conditions.push(a => a.deviceListName == this.selectedDeviceList); } if (this.selectedProjectName !== undefined) { conditions.push(a => a.projectName == this.selectedProjectName); } var fArray = arrayDetails.filter(o => conditions.every(c => c(o))); 
Sign up to request clarification or add additional context in comments.

2 Comments

Omitting != undefined seems dangerous. What if its 0 or false or ...
right, the properties could contains numbers and empty strings, or what ever falsy values.
0

As you got the nakes of the keys, just loop over them and check for undefineds:

const keys = ['empEmail', 'employeeAction', 'transactionNo', 'deviceListName', 'projectName']; const result = arrayDetails.filter(el => { for(const key of keys) { if(this[key] === undefined) continue; if(this[key] !== el[key]) return false; } return true; }); 

Comments

-1

eval to the Rescue!

While it's generally advised against, eval does exactly what you want here.

Just pass your condition variable to eval inside the .filter method and voila!

let condition=''; let a = ['empEmail', 'employeeAction', 'transactionNo', 'deviceListName', 'projectName']; if (this.selectedEmployeeAlias != undefined) { condition += '&& a => a.empEmail === this.selectedEmployeeAlias'; } if (this.employeeStatusList != undefined) { condition += '&& a.employeeAction === this.employeeStatusList' } if (this.selectedTransactionNo != undefined) { condition += '&& a.transactionNo === this.selectedTransactionNo'; } if (this.selectedDeviceList != undefined) { condition += ' && a.deviceListName == this.selectedDeviceList'; } if (this.selectedProjectName != undefined) { condition += '&& a.projectName == this.selectedProjectName'; } var finalCondition=condition.substring(2, condition.length); var fArray=arrayDetails.filter(stuff => eval(finalCondition)); 

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.