I am having a search result page which contain search result already searched by user ,In this page we also have filter option which can narrow down the existing search for e.g. user can filter the search result (By Price range , By Brand , By Category and some more criteria). If this data is available in json object on browser. How I can filter the json data based on few criteria as stated above.
For e.g User search for LCD TV and all type of LCD TV will show on search page but user can filter out the result by following option.
Filter option
By Brand - Samsung, LG, Sony, JVC , Haier, Bose, Hundayi
Br Price- Price range slider 100$ - 5000$
Most Selling-
By Size- 39inch, 49 inch, 72inch
here json data sample
{
"productList" : {
"product details" : [
{
"brand":"Lg",
"productname":"Microwave",
"price":200
},
{
"brand":"Samsung",
"productname":"Digi cam",
"price":120
},
{
"brand":"Sony",
"productname":"Lcd TV",
"price":3000
},
{
"brand":"LG",
"productname":"Flat TV",
"price":299
}
,
{
"brand":"Samsung",
"productname":"Lcd TV",
"price":700
},
{
"brand":"LG",
"productname":"Plasma TV",
"price":3000
},
{
"brand":"sony",
"productname":"Plasma TV",
"price":12929
}
]
}
}
I am having a search result page which contain search result already searched by user ,In this page we also have filter option which can narrow down the existing search for e.g. user can filter the search result (By Price range , By Brand , By Category and some more criteria). If this data is available in json object on browser. How I can filter the json data based on few criteria as stated above.
For e.g User search for LCD TV and all type of LCD TV will show on search page but user can filter out the result by following option.
Filter option
By Brand - Samsung, LG, Sony, JVC , Haier, Bose, Hundayi
Br Price- Price range slider 100$ - 5000$
Most Selling-
By Size- 39inch, 49 inch, 72inch
here json data sample
{
"productList" : {
"product details" : [
{
"brand":"Lg",
"productname":"Microwave",
"price":200
},
{
"brand":"Samsung",
"productname":"Digi cam",
"price":120
},
{
"brand":"Sony",
"productname":"Lcd TV",
"price":3000
},
{
"brand":"LG",
"productname":"Flat TV",
"price":299
}
,
{
"brand":"Samsung",
"productname":"Lcd TV",
"price":700
},
{
"brand":"LG",
"productname":"Plasma TV",
"price":3000
},
{
"brand":"sony",
"productname":"Plasma TV",
"price":12929
}
]
}
}
Share
Improve this question
edited Dec 8, 2010 at 17:54
Nidhi
asked Dec 8, 2010 at 17:28
NidhiNidhi
2012 gold badges6 silver badges13 bronze badges
2
- where are storing all the data of json ?? you are keeping in some global variable ? – kobe Commented Dec 8, 2010 at 17:34
- Data will remain in some json file. which will be created dynamically. – Nidhi Commented Dec 8, 2010 at 17:37
2 Answers
Reset to default 3This isn't very flexible as it stands but something like this might fit your needs: Working Example
filter function for data store
// dataStore = JSON object, filter = filter obj
function filterStore(dataStore, filter) {
return $(dataStore).filter(function(index, item) {
for( var i in filter ) {
if( ! item[i].toString().match( filter[i] ) ) return null;
}
return item;
});
}
usage
// result contains array of objects based on the filter object applied
var result = filterStore( store, filter);
data store as I have it
var store = [
{"brand": "Lg",
"productname": "Microwave",
"price": 200},
{"brand": "Samsung",
"productname": "Digi cam",
"price": 120},
{"brand": "Sony",
"productname": "Lcd TV",
"price": 3000},
{ "brand": "LG",
"productname": "Flat TV",
"price": 299},
{"brand": "Samsung",
"productname": "Lcd TV",
"price": 700},
{"brand": "LG",
"productname": "Plasma TV",
"price": 3000},
{"brand": "sony",
"productname": "Plasma TV",
"price": 12929}
];
filter objects I used
// RegExp used could most likely be improved, definitely not a strong point of mine :P
var filter = {
"brand": new RegExp('(.*?)', 'gi'),
"productname": new RegExp('(.*?)', 'gi'),
"price": new RegExp('299', 'gi')
};
var filter2 = {
"brand": new RegExp('LG', 'gi'),
"productname": new RegExp('(.*?)', 'gi'),
"price": new RegExp('(.*?)', 'gi')
};
var filter3 = {
"brand": new RegExp('Samsung', 'gi'),
"productname": new RegExp('(.*?)', 'gi'),
"price": new RegExp('(.*?)', 'gi')
};
var filter4 = {
"brand": new RegExp('(.*?)', 'gi'),
"productname": new RegExp('Plasma TV', 'gi'),
"price": new RegExp('(.*?)', 'gi')
};
Try
// jsonData = [{"brand": "LG"}, {"brand": "Samsung"}]
jsonData.sort(brand);
// render the grid html again
EDIT
// you dont require sorting then
var dataBrand = Array();
$.each(jsonData, function() {
if(this.brand=="LG") dataBrand[this.brand] = this;
});