Quicksand多次过滤和排序

时间:2013-05-24 12:14:14

标签: jquery quicksand

您好我正在研究这个jquery流沙,我需要多次过滤和排序。我尝试了很多工具,但有些工具已经过滤,有些工具的排序不是两者兼而有之,根本没有任有了这个我需要添加另一个过滤器(例如:住宿)。有没有办法做到这一点

jQuery(function($) {
var $filterRegion = $('#filter input[name="region"]');
var $filterSort = $('#filter #sort');

var $applications = $('#listSorting');

var $data = $applications.clone();

$filterRegion.add("#sort").change(function(e) {

  var $sortedValue = $(this).val();

    if ($($filterRegion+':checked').val() == 'all') {
    var $filteredData = $data.find('li');
  } else {
    var $filteredData = $data.find('li[data-region=' + $($filterRegion+":checked").val() + ']');
    if($filteredData.length <= "0"){
        $(".failedFilterResults").html("No data available");
    }
    else{
        $(".failedFilterResults").html("");
    }
  }


 if ($('#filter #sort').val() == "price") {
    var $sortedData = $filteredData.sorted({
      by: function(v) {
        var priceValue = $(v).find('span.currentprice').text();
        priceValue = priceValue.replace('$','');
        return parseFloat(priceValue);
      }
    });
  } else if($('#filter #sort').val() == "name"){
    var $sortedData = $filteredData.sorted({
      by: function(v) {
        return $(v).find('strong').text().toLowerCase();
      }
    });
  }
  else{

  }

  $applications.quicksand($sortedData, {
    duration: 800
  });

});

});

1 个答案:

答案 0 :(得分:-1)

在这里,您可以找到我的示例,其中包含两个过滤器和字母排序:

http://jsfiddle.net/AVnzX/

这是我的过滤器设置:

<form id="filter">
<select name="country" id="filterCountry">
    <option value="alle">Alle</option>
    <option value="usa">USA</option>
    <option value="germany">Germany</option>
    <option value="australia">Australia</option>
</select>
<select name="city" id="filterCity">
    <option value="alle">Alle</option>
    <option value="newyork">New York</option>
    <option value="sydney">Sydney</option>
    <option value="paris">Paris</option>
    <option value="munich">Munich</option>
    <option value="berlin">Berlin</option>
    <option value="losangeles">Los Angeles</option>
    <option value="miami">Miami</option>
    <option value="hamburg">Hamburg</option>
    <option value="frankfurt">Frankfurt</option>
    <option value="sanfrancisco">San Francisco</option>
</select>
<select name="alphabet" id="filterName">
    <option value="name">Name</option>
    <option value="country">Country</option>
    <option value="city">City</option>
</select>