ReactJS - Validate Nested-IF/ELSE Statement - reactjs

Question

In my react app I'm using IF statement inside another IF statement to validate a condition that I want to get data filtered only from a specific column not from all.
Basically I'm using AntD table in which I'm displaying students data. In a table I do have few columns namely Age, Marks and Attendance. On each column(Age, Marks and Attendance) I'm applying a range filter with aim to fetch student(s) when applied search on a specific column i.e. either Age, Marks or on Attendance.
The problem I'm getting that my Nested-IF condition is not validating to true. Rest of code is working fine. I also tried to run code without Nested-IF(I mean with the simple IF/ELSE statement). That is also working fine.
I don't know what did I wrong or what I'm missing/skipping in my attempt.
Help me to validate my Nested-IF/ELSE statement(s).
What I'm trying is:
const handleSearch = (firstInput, secondInput, dataIndex) => {
setSearchStu(
student.filter((obj) => {
if (dataIndex === "age") {
if (obj.age >= firstInput && obj.age <= secondInput) {
return true;
} else {
return false;
}
} else {
if (dataIndex === "marks") {
if (obj.marks >= firstInput && obj.marks <= secondInput) {
return true;
} else {
return false;
}
} else {
if (dataIndex === "attendance") {
if (obj.attendance >= firstInput && obj.attendance <= secondInput) {
return true;
} else {
return false;
}
} else {
return false;
}
}
}
})
);
};
Where
firstInput is the 1st input field in a range filter
secondInput is the 2nd input field in a range filter
dataIndex is like a key to validate my 1st IF statement in Nested-IF case
Values "age", "marks" and "attendance" are the defined values which are uniquely correspond to the each columns(Age, Marks and Attendance) in the table
and so on..
Thank you in advance for your assistance.

Answer 1

to simplfy your code, you can try this :
const handleSearch = (firstInput, secondInput, dataIndex) => {
setSearchStu(
student.filter((obj) => {
if (dataIndex === "age") {
return (obj.age >= firstInput && obj.age <= secondInput)
} else {
if (dataIndex === "marks") {
return (obj.marks >= firstInput && obj.marks <= secondInput)
} else {
if (dataIndex === "attendance") {
return (obj.attendance >= firstInput && obj.attendance <= secondInput)
} else {
return false;
}
}
}
})
);
};
or like this :
switch(dataIndex){
case "age" :
return (obj.age >= firstInput && obj.age <= secondInput)
break;
case "marks" :
return (obj.marks >= firstInput && obj.marks <= secondInput)
break;
case "attendance" :
return (obj.attendance >= firstInput && obj.attendance <= secondInput)
break;
default :
return false
}

Answer 2

The function does work given the right inputs and data - I made a sandbox on replit to verify. Possibly there is an issue with the student data (consider renaming to students) or with the inputs to the function. Also, the function can be simplified to the following (see replit sandbox):
const handleSearch = (firstInput, secondInput, dataIndex) => {
return (
student.filter((obj) => {
if (["age", "marks", "attendance"].includes(dataIndex)) {
return obj[dataIndex] >= firstInput && obj[dataIndex] <= secondInput
}
return false
})
);
};