我使用Filterizr作为模板来显示我们的出版物。 我已插入出版年份和作者。 当试图根据出版年份或作者(按字母顺序)排序时,我看到图像移动,但后来我没有得到正确的顺序。 你们中的任何一个人都可以帮我解决这个排序问题吗?
https://jsfiddle.net/gdhia/yLdtmeqL/
在他们的页面中,他们说出我不理解的事情:
.filterizr('sort'[,attr] [,sortOrder])
根据特定属性属性按升序或降序对元素进行排序,并在屏幕上重新排列。
attr (typeof: String / Default: 'domIndex') The attribute based on which the elements are sorted. If not provided it defaults to value 'domIndex' and the elements are sorted based on their initial position in the DOM. If its value is set to 'sortData', the elements are sorted based on the value of the user-defined data-sort attribute. Other possible values includes 'w' or 'h' if you wish to sort your elements by width or height (used for layouts of items of different size).
答案 0 :(得分:1)
我是Filterizr的作者, 你在使用预设的Filterizr控件吗?
如果您想按作者姓名对项目进行排序,则需要在每个元素的data-sort属性中的每个项目上包含该作者姓名。 e.g。
<div class="filtr-item" data-sort="Author name"></div>
然后您的排序控件将为您完成剩余的工作。
如果您想调用公共方法,那么您只需执行
//to instantiate your filterizr
var fltr = $('.filtr-container').filterizr();
//then to sort, since sortData will be now referring to authors' names
fltr.filterizr('sort', 'sortData', 'asc');
更新:由于显然您希望按多个条件排序,因此我添加了Filterizr按自定义的用户定义数据属性排序的功能。 确保从GitHub仓库中获取最新的Filterizr版本并尝试:
<div class="filtr-item" data-author="Author Name" data-publishyear="1990"></div>
然后致电:
fltr.filterizr('sort', 'author', 'asc') //to sort by author name
fltr.filterizr('sort', 'publishyear', 'asc') //to sort by publish year
要为自定义数据属性添加控件,只需添加到您的选择输入:
<option value="author">Author Name</option>
<option value="publishyear">Publish Year</option>
您可以根据需要添加任意数量的数据属性进行排序,只需记住不要包含&#34;数据 - &#34;将名字作为参数传递时的一部分。我还在Filterizr网站上添加了一个深入的排序教程。享受!