How can i use find + filter to return price range?

Question

I have a list of items and i need to return only the items that the price is between the price range of "min" and "max".

Here is full working Example that sort the items by class, But as you can see the slider doesn't affect the price range, Here is the full code:

http://jsfiddle.net/p2jwz/8/

so, as you can see, Here is the .find and .filter code:

  var price = data.find('li').filter(function() {
    var price = parseFloat($(this).data('price'));
   return price >= minPrice && price <= maxPrice;
}); 

Can you tell me what I'm doing wrong?

Answer 1

Finally! I found the solution, you simply have to call function with all vars

function showProducts($holder, data, minPrice, maxPrice) {

   var $price = data.find('li').filter(function() {
        var $price = parseInt($(this).data("price"), 10);
        return $price >= minPrice && $price <= maxPrice;
    });

            // call quicksand and assign transition parameters
        $holder.quicksand($price, {
            duration: 800,
            easing: 'easeInOutQuad'
        });
        return false;
}

Hope that help!

Answer 2

You probably need

var price = data.find('li').filter(function() {
    var price = parseFloat($(this).data('price'));
   return price >= minPrice && price <= maxPrice;
}); 

The filter() function is supposed to return a boolean indicating whether the currently evaluated element should be included in the returned collection or not. If you return the price, every element that does not have price === 0 will be returned, since positive integers are "truthy", i.e evaluates to true when considered as a boolean.

You also have something looking like

$(document).ready(function(){
...
    $(function(){
        ...
    });
});

i.e. wrapped two document.ready function bindings. I think you can simply remove the inner one. Your slider still seems to be initialized somehow but maybe this can cause some malfunctioning still.

There is also an error happening in your fiddle:

TypeError: sel.getElement(...) is null