同位素 - 一个过滤器不工作，但其他人做...

Question

你可以找到一个工作示例here。

你会发现，所有的顶级各种各样的工作，除了排序“名”或“姓” ......

下面是从我迄今所做的代码片段...

<div class="option-combo shape"> 
    <h3>By First Name or Last Name</h3> 

    <ul id="sort-by" class="option-set clearfix" data-option-key="sortBy"> 
     <li><a href="#sortBy=original-order" data-option-value="original-order" class="selected" data>All Employees</a></li> 
     <li><a href="#sortBy=first" data-option-value="first">First Name</a></li> 
     <li><a href="#sortBy=last" data-option-value="last">Last Name</a></li>  
    </ul> 

我迄今取得一些进展...

目前，下面的代码被注释掉了。如果我删除评论，那么我可以排序，但只能按姓氏排序。此外，启用此功能后，其他类型将不再起作用，我似乎无法使其具有内聚性。

<!-- Allows for sort by last name --> 
     var $optionSets = $('#options .option-set'), 
      $optionLinks = $optionSets.find('a'); 

     $optionLinks.click(function(){ 
     var $this = $(this); 
     // don't proceed if already selected 
     if ($this.hasClass('selected')) { 
      return false; 
     } 
     var $optionSet = $this.parents('.option-set'); 
     $optionSet.find('.selected').removeClass('selected'); 
     $this.addClass('selected'); 

     // make option object dynamically, i.e. { filter: '.my-filter-class' } 
     var options = {}, 
      key = $optionSet.attr('data-option-key'), 
      value = $this.attr('data-option-value'); 
     // parse 'false' as false boolean 
     value = value === 'false' ? false : value; 
     options[ key ] = value; 
     if (key === 'layoutMode' && typeof changeLayoutMode === 'function') { 
      // changes in layout modes need extra logic 
      changeLayoutMode($this, options) 
     } else { 
      // otherwise, apply new options 
      $container.isotope(options); 
     } 

     return false; 
     }); 

非常感谢您的协助！

Answer 1

我问大卫DeSandro这件事，他回答说有以下...

我希望修订本，并在大检修在一两个月来简化它。

现在呢！看起来你只需要设置排序的点击处理程序。见Codepen，看看它是如何工作的？

// Alphabetical Sort 
var $sortBy = $('#sort-by'); 

$sortBy.on('click', 'a', function(event) { 
    var $this = $(this); 
    var sortName = $this.attr('data-option-value'); 
    $container.isotope({ sortBy: sortName }); 
    $sortBy.find('.selected').removeClass('selected'); 
    $this.addClass('selected'); 
}); 

头的了 - 我改变了对getSortData第一

first : function($elem) { 
return $elem.find('.first').text(); 
}, 

我希望让你在正确的方向。