I am developing a member search function for my web app, I want a powerful search feature that can deal with multiple search parameters either one at a time (ie members who are 18-27) or more than one at a time (ie members who are 18-27 AND whose minimum rate is 20).
I want to use ranges for many of the options to allow searches between two values such as age.
I also want to use a checkbox to set specific functions - such as cleaning, DIY etc - and have those filtered as part of the results too.
The principle is that a user would make their search selections, click apply filter and the members would be filtered based on data attributes such as data-age - the values of these attributes are pulled from my database.
I have achieved this with age and thought it would be a case of simply replicating that for other fields but that has not been the case.
Age works perfectly, but the new addition of price doesn’t work at all - and I suspect even if price was working it wouldn’t be ‘chained’ with other search criteria (eg if an age range has also been entered).
I’m looking for some guidance on how I can use text fields, checkboxes, drop down selections (as ranges) and have them work together or independently.
I am using the following JavaScript;
<script type="text/javascript">
$("input[type='applyfilter']").click(function() {
$('.box').hide();
min_age = $("#age-min").val()
max_age = $("#age-max").val()
min_price = $("#price-min").val()
max_price = $("#price-max").val()
for (i = min_age; i <= max_age; i++){
$("div[data-age=" + i + "]").show();
}
for (i = min_price; i <= max_price; i++){
$("div[data-price=" + i + "]").show();
}
// Slide advanced panel up
$('.filter-panel').collapse('hide');
});
</script>
I’m stuck at this point and would appreciate any help.