سؤال

أحاول فرز جدول له عمود مثل 2009-12-17 23:59:59.0وبعد أنا أستخدم أدناه لتطبيق فرز

$(document).ready(function() 
        { 
            $("#dataTable").tablesorter();  
        } 
    );

لكنها لا تعمل في تواريخ التنسيق YYYY-MM-DD. هل يمكن لأي شخص يقترح كيف يمكنني تطبيق هذا التنسيق للفرز؟

هل كانت مفيدة؟

المحلول

سيكون الشيء الصحيح الذي يجب القيام به هو إضافة المحلل المحلل الخاص بك لهذا التنسيق المخصص.

تحقق من هذا للحصول على فهم حول كيفية عمل ذلك.

JQUERY TILLILLARDER: إضافة المحلل المحلل الخاص بك

ثم إلقاء نظرة على مصدر TILLOWER (البحث عن USLONGDATE، SHORTDITE، ثم شاهد كيفية إجراء المحللين لتنسيقات التاريخ داخليا عن طريق Tollerwer. الآن قم ببناء نفسك محللا مشابها بتنسيق التاريخ الخاص بك.

jQuery.tablesorter.js.

هذا يجب أن يعمل على رغبتك

ts.addParser({
    id: "customDate",
    is: function(s) {
        //return false;
        //use the above line if you don't want table sorter to auto detected this parser
        //else use the below line.
        //attention: doesn't check for invalid stuff
        //2009-77-77 77:77:77.0 would also be matched
        //if that doesn't suit you alter the regex to be more restrictive
        return /\d{1,4}-\d{1,2}-\d{1,2} \d{1,2}:\d{1,2}:\d{1,2}\.\d+/.test(s);
    },
    format: function(s) {
        s = s.replace(/\-/g," ");
        s = s.replace(/:/g," ");
        s = s.replace(/\./g," ");
        s = s.split(" ");
        return $.tablesorter.formatFloat(new Date(s[0], s[1]-1, s[2], s[3], s[4], s[5]).getTime()+parseInt(s[6]));
    },
    type: "numeric"
});

الآن فقط قم بتطبيقه على العمود حيث يكون لديك هذا التنسيق (على سبيل المثال على افتراض العمود المواعيد المخصصة الموجودة في العمود رقم 7. (6 تعني العمود 7، لأن مجموعة الأعمدة هي Zerobased)

$(function() {
    $("table").tablesorter({
        headers: {
            6: { sorter:'customDate' }
        }
    });
});

نصائح أخرى

فرز تنسيق التاريخ في المملكة المتحدة / أوروبي DD / مم / YYYY بواسطة:

$("#tableName").tablesorter({dateFormat: "uk"});

إذا كنت تستخدم تنسيق التاريخ / الوقت مثل MM / DD / YYYY HH: MM ثم استخدم أدناه

$.tablesorter.addParser({ 
        id: "customDate",
        is: function(s) {
            //return false;
            //use the above line if you don't want table sorter to auto detected this parser                        
            //21/04/2010 03:54 is the used date/time format 
            return /\d{1,2}\/\d{1,2}\/\d{1,4} \d{1,2}:\d{1,2}/.test(s);
        },
        format: function(s) {
            s = s.replace(/\-/g," ");
            s = s.replace(/:/g," ");
            s = s.replace(/\./g," ");
            s = s.replace(/\//g," ");
            s = s.split(" ");                       
            return $.tablesorter.formatFloat(new Date(s[2], s[1]-1, s[0], s[3], s[4]).getTime());                                         
        },
        type: "numeric"} );

مع أحدث إصدار 2.18.4 يمكنك ببساطة أن تفعل مثل هذا. إعطاء هذا التنسيق التاريخ الافتراضي وفي عمود معين تعيين تنسيق تاريخ العمود هذا سيعمل فقط مع فارز "Shortdate" فقط.

$('YourTable').tablesorter(
            {
                dateFormat:'mmddYYYY',
                headers: {
                    0: { sorter: false },
                    1: { sorter: true},
                    2: { sorter: true },
                    3: { sorter: true },
                    4: { sorter: "shortDate", dateFormat: "ddmmyyyy" },
                    5: { sorter: true },
                    6: { sorter: false },
                    7: { sorter: false },
                    8: { sorter: false },
                    9: { sorter: false },
                    10: { sorter: false },
                    11: { sorter: false }

                }
            });

لا حاجة لإنشاء محلل جديد فقط استخدم Exisitng One مع القليل من التعديل.

1. افتح JQuery Plugin JS، حيث سترى البرنامج النصي أدناه. الآن تغيير تنسيق التاريخ (المطلوب) لآخر آخر إذا كان في حالتك "YY-MM-DD".

    ts.addParser({
    id: "shortDate",
    is: function (s) {
        return /\d{1,2}[\/\-]\d{1,2}[\/\-]\d{2,4}/.test(s);
    }, format: function (s, table) {
        var c = table.config;
        s = s.replace(/\-/g, "/");
        if (c.dateFormat == "us") {
            // reformat the string in ISO format
            s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$1/$2");
        } else if (c.dateFormat == "uk") {
            // reformat the string in ISO format
            s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1");
        } else if (c.dateFormat == "yy-mm-dd" || c.dateFormat == "dd-mm-yy") {
            s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{2})/, "$1/$2/$3");
        }
        return $.tablesorter.formatFloat(new Date(s).getTime());
    }, type: "numeric"
});



2. الآن اتبع الخطوة الأخيرة المذكورة بواسطة jitter، ولكن مع القليل من التعديل.

$(function() {
$("table").tablesorter({
    headers: {
        6: { sorter:'shortDate' }
    }
});
});

DateFormat: "mmddyyyy"، // تعيين تنسيق التاريخ الافتراضي

مثال-خيار التاريخ تنسيق

ما عليك سوى إضافة خيار آخر يعمل تماما بالنسبة لي لفرز تنسيق التاريخ (DD / MM / YYYY HH: MM: SS). باستخدام JS DataTables. توصيل في.

أضف التعليمات البرمجية أدناه إلى رمزك:

$(document).ready(function () {
oTable = $('#AjaxGrid').dataTable({
"aLengthMenu": [[5, 10, 25, 50, 100, 500,1000,-1], [5, 10, 25, 50, 100,500,1000,"All"]],
iDisplayLength: 1000,
aaSorting: [[2, 'asc']],
bSortable: true,
aoColumnDefs: [
{ "aTargets": [ 1 ], "bSortable": true },
{ "aTargets": [ 2 ], "bSortable": true },
{ "aTargets": [ 3 ], "bSortable": true },
{ "aTargets": [ 4 ], "bSortable": true },
{"aTargets": [ 5 ], "bSortable": true, "sType": "date-euro"},
{"aTargets": [ 6 ], "bSortable": true, "sType": "date-euro"},
{ "aTargets": [ 7 ], "bSortable": false }
],
"sDom": '<"H"Cfr>t<"F"ip>',
"oLanguage": {
"sZeroRecords": "- No Articles To Display -",
"sLengthMenu": "Display _MENU_ records per page",
"sInfo": " ", //"Displaying _START_ to _END_ of _TOTAL_ records",
"sInfoEmpty": " ", //"Showing 0 to 0 of 0 records",
"sInfoFiltered": "(filtered from _MAX_ total records)"
},
"bJQueryUI": true
});
});


//New code
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"date-euro-pre": function ( a ) {
if ($.trim(a) != '') {
var frDatea = $.trim(a).split(' ');
var frTimea = frDatea[1].split(':');
var frDatea2 = frDatea[0].split('/');
var x = (frDatea2[2] + frDatea2[1] + frDatea2[0] + frTimea[0] + frTimea[1] + frTimea[2]) * 1;
} else {
var x = 10000000000000; // = l'an 1000 ...
}

return x;
},

"date-euro-asc": function ( a, b ) {
return a - b;
},

"date-euro-desc": function ( a, b ) {
return b - a;
}
} );
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top