如何根据jquery中单击的选项对JSON对象进行排序?

时间:2015-05-07 13:10:11

标签: javascript php jquery json sorting

以下是我的ajax:这将显示来自PHP页面的查询结果,该查询按用户键入categorypostcoderate进行过滤。

$("form").on("submit", function () {
    var data = {
        "action": "test"
    };

    data = $(this).serialize() + "&" + $.param(data);
    $.ajax({
        type: "POST",
        dataType: "json",
        url: "ajax2.php",
        data: data,
        success: function (data) {

        $("#main_content").slideUp("normal",function(){
         for (i = 0; i < data.length; i++) {

$(".the-return").append("<div class='inside_return'>Name:" + data[i].name + "<br/>Id:" + data[i].id + "<br/>Pricing:" + data[i].rate + "<br/>Postcode:" + data[i].postcode+ "<br/>Reputation:" + data[i].reputation+"<br/>Review Plus:" + data[i].plus+"<br/>Review Negative:" + data[i].neg+"<br/><h1>Availability</h1>Week Morning:" + data[i].weekM+"<br/>Week Afternoon:" + data[i].weekA+"<br/>Week Evening:" + data[i].weekE+"<br/>Weekend Morning:" + data[i].endM+"<br/>Weekend Afternoon:" + data[i].endA+"<br/>Week Evening:" + data[i].endE+"</div>");


            //alert(data[i].name) 
        }

            });
        }


    });
    return false;


});

我想知道如何控制这部分,我的意思是如何控制成功后要采取的行动:

默认情况下,它可以显示如下:但是当点击“按费率排序”时,它应按费率排序并显示在.the-return内。当点击排序时,它应按排名和显示排序。如何在此处找到switch语句并相应显示?我已经厌倦了寻找答案,任何帮助将不胜感激!在此先感谢!!!!

success: function (data) {

            $("#main_content").slideUp("normal",function(){
             for (i = 0; i < data.length; i++) {

    $(".the-return").append("<div class='inside_return'>Name:" + data[i].name + "<br/>Id:" + data[i].id + "<br/>Pricing:" + data[i].rate + "<br/>Postcode:" + data[i].postcode+ "<br/>Reputation:" + data[i].reputation+"<br/>Review Plus:" + data[i].plus+"<br/>Review Negative:" + data[i].neg+"<br/><h1>Availability</h1>Week Morning:" + data[i].weekM+"<br/>Week Afternoon:" + data[i].weekA+"<br/>Week Evening:" + data[i].weekE+"<br/>Weekend Morning:" + data[i].endM+"<br/>Weekend Afternoon:" + data[i].endA+"<br/>Week Evening:" + data[i].endE+"</div>");

            }

        });
       }        



    });
   return false;

  });

3 个答案:

答案 0 :(得分:1)

Json对象可以这样排序:

data.sort(function (a, b) {
    var retVal = 0;
    switch (sortOption) {
        case 1:
            retVal = a.property > b.property ? 1 : (a.property < b.property ? -1 : 0);
            break;
        ....
    }
    return retVal;
});

解释: data这里是一个json对象。 sort()是一个javascript函数。为json数组中的每对json对象调用此函数。 js使用返回值(retVal此处)来确定json元素a是否在json元素b之前。如果retVal值为1,则ba之前,反之亦然为-1而未定为0. sortOption是您的要求。您可以使用它来决定比较元素的内容,具体取决于用户选择的Sort by值 您可以将此代码放在要对json数组进行排序的位置。

代码:

success: function (data) {
    data.sort(function (a, b) {
        var retVal = 0;
        switch (sortOption) {
            case 1:
                retVal = a.property > b.property ? 1 : (a.property < b.property ? -1 : 0);
                break;
                // .... many cases here
        }
        return retVal;
    });
    $("#main_content").slideUp("normal", function () {
        for (i = 0; i < data.length; i++) {

            $(".the-return").append("<div class='inside_return'>Name:" + data[i].name + "<br/>Id:" + data[i].id + "<br/>Pricing:" + data[i].rate + "<br/>Postcode:" + data[i].postcode + "<br/>Reputation:" + data[i].reputation + "<br/>Review Plus:" + data[i].plus + "<br/>Review Negative:" + data[i].neg + "<br/><h1>Availability</h1>Week Morning:" + data[i].weekM + "<br/>Week Afternoon:" + data[i].weekA + "<br/>Week Evening:" + data[i].weekE + "<br/>Weekend Morning:" + data[i].endM + "<br/>Weekend Afternoon:" + data[i].endA + "<br/>Week Evening:" + data[i].endE + "</div>");

        }

    });
}

答案 1 :(得分:0)

调用sortByProperty,传递属性名称,要排序的数组,以及表示是否按降序排序的bool。

var currentlySortingBy = '';
var sortDesc = true;

var sortByProperty = function (propertyName, array, sortDescending) {
    currentlySortingBy = propertyName;
    sortDesc = sortDescending;

    return array.slice(0).sort(propertyComparer);
};

var propertyComparer = function (a, b) {
    var isString = typeof a[currentlySortingBy] === 'string';

    var aProp = isString ? a[currentlySortingBy].toLowerCase() : a[currentlySortingBy];
    var bProp = isString ? b[currentlySortingBy].toLowerCase() : b[currentlySortingBy];

    var sortDir = sortDesc ? 1 : -1;
    return ((aProp < bProp) ? sortDir : ((aProp > bProp) ? -sortDir : 0));
};

答案 2 :(得分:0)

实际上有多种方法可以对JSON对象进行排序。第一种方法是编写自己的订单功能。

var sort_by = function(field, reverse, primer){

   var key = primer ? 
       function(x) {return primer(x[field])} : 
       function(x) {return x[field]};

   reverse = !reverse ? 1 : -1;

   return function (a, b) {
       return a = key(a), b = key(b), reverse * ((a > b) - (b > a));
     } 
}

// Sort by price high to low
myJson.sort(sort_by('price', true, parseInt));

// Sort by city, case-insensitive, A-Z
myJson.sort(sort_by('city', false, function(a){return a.toUpperCase()}));

获自:https://stackoverflow.com/a/979325/2076351

另一种选择是使用下划线。

_.sortBy([1, 2, 3, 4, 5, 6], function(num){ return Math.sin(num); });
=> [5, 4, 6, 3, 1, 2]

var stooges = [{name: 'moe', age: 40}, {name: 'larry', age: 50}, {name: 'curly', age: 60}];
_.sortBy(stooges, 'name');
=> [{name: 'curly', age: 60}, {name: 'larry', age: 50}, {name: 'moe', age: 40}];

如此处所示:http://underscorejs.org/#sortBy