Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
How to filter object array based on attributes in jQuery?
To filter object array based on attributes in jQuery, use the map() method with JSON. The $.map() function creates a new array with the results of calling a provided function on every element in the calling array.
Example
You can try to run the following code to learn how to filter object array based on attributes in jQuery. This example filters department data based on employee count and shares criteria ?
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var json = {
"DEPARTMENT": [
{
"id": "1",
"deptemp": "840",
"shares": "1100"
},
{
"id": "2",
"deptemp": "1010",
"shares": "1900"
},
{
"id": "3",
"deptemp": "350",
"shares": "510"
},
{
"id": "4",
"deptemp": "475",
"shares": "1200"
}
]
};
// Filter departments with employees <= 500 and shares >= 500
json.DEPARTMENT = $.map(json.DEPARTMENT, function(val, key) {
if(Number(val.deptemp) <= 500 && Number(val.shares) >= 500) {
return val;
}
});
// Display filtered results
var output = "";
for(var i = 0; i < json.DEPARTMENT.length; i++) {
output += "Department ID: " + json.DEPARTMENT[i].id +
", Employees: " + json.DEPARTMENT[i].deptemp +
", Shares: " + json.DEPARTMENT[i].shares + "<br>";
}
$("#result").html(output);
});
</script>
</head>
<body>
<h3>Filtered Department Results:</h3>
<div id="result"></div>
</body>
</html>
The output of the above code is ?
Filtered Department Results: Department ID: 3, Employees: 350, Shares: 510 Department ID: 4, Employees: 475, Shares: 1200
Conclusion
The $.map() method effectively filters object arrays by evaluating conditions on object attributes and returning only matching elements. This approach provides a clean way to filter JSON data based on multiple criteria in jQuery applications.
Updated on: 2026-03-13T18:48:09+05:30
2K+ Views
Advertisements