0

我有一个 parentdiv的集合，它们根据它们的唯一订单号标记id，比如，<div id='parent_uniqueID'>。它们每个都有包含订单信息的子 div：订单号（同上）、名称和订单日期（mm / dd / yy）。

我正在尝试根据这些列中的每一列对这些父 div 进行排序。

它很容易按订单号排序并重新排列父 div。我对它们进行排序，然后使用 $('#parent_' + order_number);` 之类的东西选择父 div，然后将它们附加到页面上。字母数字也很简单；在字母数字字符串的末尾，我附加了顺序，然后再对其进行排序。这很方便，因为这样如果两个订单具有相同的名称，则父 div 默认按订单号排序。

我不知道如何，一旦完成按日期排序，区分哪个日期属于哪个父 div，以便我可以通过 抓取父 divids并在页面上重新排列它们。

当我试图理解数字排序时，我收到了这个非常好的解决方案，我正在尝试适应日期：

$('.sortable').click(function () {
    if ($(this).hasClass('sortable_date')) {

        var sort_order = sort_class_distribution($(this)),
            sort_column = this.id.replace("header_", "") + "_div",
            content2 = $('#currentOrdersContent2'),
            date_holder = "",
            i = 0;



        var sorted = $('.' + sort_column).map(function () {

            date_holder = $.trim($(this).text());
            //get order number from parent div
            //only_numbers function strips out everything but numbers
            cur_order = only_numbers($(this).parents('.order_details_bg_trigger').attr('id'));


            //check that the text is not "Not given" or "Unavailable"
            if (date_holder.indexOf("/")) {
                cur_date = date_holder.split(" / ");
                //change the text string into a proper javascript date
                return new Date(cur_date[2], cur_date[0] - 1, cur_date[1]);
            } else {
                //if it is 'Not given', assign it today's date
                return new Date();
            }
        }).toArray().sort(sort_order = "asc" ? date_sort_asc : date_sort_desc);


        //change javascript date back to mm / dd / yy format
        //weak attempt to match sorted dates with dates contained in table
        $.each(sorted, function (i, item) {

            cur_date = ('0' + (item.getMonth() + 1)).slice(-2) + ' / ' + ('0' + item.getDate()).slice(-2) + ' / ' + item.getFullYear();

        });

    }

});

这些是日期排序函数： 来源：https ://gist.github.com/1772996

function date_sort_asc(date1, date2) {
    if (date1 > date2) return 1;
    if (date1 < date2) return -1;
    return 0;
}

function date_sort_desc(date1, date2) {
    if (date1 > date2) return -1;
    if (date1 < date2) return 1;
    return 0;
}

欢迎任何有关如何执行此操作或新模式的建议。谢谢！

4

2 回答 2

0

如果您有可能使用 HTML5 功能，您可以做的一件事来简化整个过程，就是将每个父 div 的一些关键数据嵌入到 div 本身中。可以为每个父 div 做这样的事情：

<div id='parent_uniqueID' data-date='somedate' data-orderNo='someorderno'>

之后，您可以使用例如 jquery 来收集数据，如下所示：

$("#parent_uniqueID").data("date")

并轻松找到您需要比较和排序的内容，而无需在父 div 中查找数据的位置。希望这可以帮助您更接近解决方案！

于 2012-06-25T20:19:44.223 回答
0

我可能会使用 jQuery 元数据插件 (http://docs.jquery.com/Plugins/Metadata)。然后给你的包装器（父） div 你可能排序的所有值（例如，日期、价格等）。使用父 div 中包含的所有元数据，您无需做任何计算来决定哪些子与哪个父一起使用，只需重新排序您的父 div。

于 2012-06-25T20:21:13.710 回答