Question

我尝试了很多不同的方法，但似乎无法解决这个问题。我有一个JSon数组填充我的JQuery列表。列表显示正确，但我似乎无法过滤它。

我希望能够按名称或价格进行过滤。我尝试了JQuery .Filter方法和许多其他方法，但它们都失败了。我也想把它作为一个链接。（用户点击按名称排序，然后对其进行排序......）

到目前为止我所拥有的东西，我相信它会起作用。

非常感谢任何帮助，谢谢！

.js文件：



// Json array
var productList = {"products": [
    {"description": "Product 1", "price": "3.25"},
    {"description": "Product 4", "price": "9.97"},
    {"description": "Product 3", "price": "4.21"},
    {"description": "Product 2", "price": "5.24"},
    {"description": "Product 5", "price": "8.52"}
]
};

function loadList() {

var list = $("#productList").listview();


// load array into list

$(productList.products).each(function(index) {
    $(list).append('<li id="listitem">' + this.description + "  " +
            "    :     " + this.price + '</li>');

     // sort by price 
     $(productList.products).filter(function ()
     { return parseFloat(this.price) < 11;})


});

    $(list).listview("refresh");

}

Answer 1

排序：

的情况如何？

var prods = productList.products.sort(function(a, b) {return parseInt(a.price) < parseInt(b.price);});
$.each(prods, function() {
    list.append("<li>" + this.description + " : " + this.price + "</li>");
});

要按说明排序，您可以改用：

var prods = productList.products.sort(function(a, b) {return a.description < b.description;});

如果您只想过滤，则可以替换：

var prods = productList.products.filter(function(item) {return parseInt(item.price) < 5;});

Answer 2

这种过滤通常最好在服务器端进行。您是否尝试过在数据库或应用程序级别应用过滤？

Answer 3

出于这种目的，出现了很多json路径（xpath like）工具。查看http://goessner.net/articles/JsonPath/

对从JSon数组填充的JQuery列表进行排序

3 个答案: