Wie by Date mit Datentabellen sortieren jQuery-Plugin?

https://stackoverflow.com/questions/2862322

30-09-2019
|

Frage

Ich bin mit den Datentabellen jQuery-Plugin und wollen Sorty von Terminen.

Ich weiß, dass sie ein Plugin bekamen, aber ich kann nicht finden, wo es tatsächlich zum Download von

Ich glaube, ich brauche diese Datei:. DataTables.numericComma.js doch kann ich es nicht überall und wenn ich Datentabellen herunterladen es scheint nicht in der Zip-Datei zu sein

Ich bin auch nicht sicher, ob ich brauche, um mein eigenes Datum Sortierer machen in diesem Plugin zu übergeben.

Ich versuche, dieses Format MM / DD / YYYY HH zu sortieren: MM TT (AM | PM)

Danke

Bearbeiten

Wie kann ich das ändern von MM / DD / YYYY HH sortieren: MM TT (AM | PM) und ändern Sie es in der US-Datum

jQuery.fn.dataTableExt.oSort['uk_date-asc']  = function(a,b) {
    var ukDatea = a.split('/');
    var ukDateb = b.split('/');

    var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
    var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

    return ((x < y) ? -1 : ((x > y) ?  1 : 0));
};

jQuery.fn.dataTableExt.oSort['uk_date-desc'] = function(a,b) {
    var ukDatea = a.split('/');
    var ukDateb = b.split('/');

    var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
    var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

    return ((x < y) ? 1 : ((x > y) ?  -1 : 0));
};

Lösung

Klicken Sie auf "Details anzeigen" -Link unter Datum (TT / MM / YYY) , dann können Sie kopieren und einfügen, dass Plugin-Code zur Verfügung gestellt dort

Update: Ich glaube, Sie können nur die Reihenfolge der Anordnung wechseln, etwa so:

jQuery.fn.dataTableExt.oSort['us_date-asc']  = function(a,b) {
    var usDatea = a.split('/');
    var usDateb = b.split('/');

    var x = (usDatea[2] + usDatea[0] + usDatea[1]) * 1;
    var y = (usDateb[2] + usDateb[0] + usDateb[1]) * 1;

    return ((x < y) ? -1 : ((x > y) ?  1 : 0));
};

jQuery.fn.dataTableExt.oSort['us_date-desc'] = function(a,b) {
    var usDatea = a.split('/');
    var usDateb = b.split('/');

    var x = (usDatea[2] + usDatea[0] + usDatea[1]) * 1;
    var y = (usDateb[2] + usDateb[0] + usDateb[1]) * 1;

    return ((x < y) ? 1 : ((x > y) ?  -1 : 0));
};

Alles, was ich tat, war die __date_[1] Schalter (Tag) und __date_[0] (Monat) und ersetzt uk mit us, so dass Sie sich nicht verwirren wird. Ich denke, dass sollte für Sie darum kümmern.

Update # 2: Sie sollten nur das Datum in der Lage zu verwenden Objekt zum Vergleich. Versuchen Sie folgendes:

jQuery.fn.dataTableExt.oSort['us_date-asc']  = function(a,b) {
 var x = new Date(a),
     y = new Date(b);
 return ((x < y) ? -1 : ((x > y) ?  1 : 0));
};

jQuery.fn.dataTableExt.oSort['us_date-desc'] = function(a,b) {
 var x = new Date(a),
     y = new Date(b);
 return ((x < y) ? 1 : ((x > y) ?  -1 : 0));
};

Andere Tipps

Datum sortieren - mit einem verborgenen Elemente

Konvertieren Sie das Datum in das Format YYYYMMDD und prepend auf den aktuellen Wert ( MM / DD / YYYY ) in der <td>, wickeln Sie es in einem Element, Set-Stil display:none; zu den Elementen. Nun ist die Sortierung nach Datum wird als normale Art arbeiten. Das gleiche gilt bisher Zeit Art angewendet werden.

HTML

<table id="data-table">
   <tr>
     <td><span>YYYYMMDD</span>MM/DD/YYYY</td>
   </tr>
</table>

CSS

#data-table span {
    display:none; 
}

Sie sollten die Verwendung der HTML5-Daten machen Attribute. https://www.datatables.net/examples/advanced_init/html5-data -attributes.html

Fügen Sie einfach die Daten Ordnung Element td-Element .
Keine Plugins erforderlich.

<table class="table" id="exampleTable">
    <thead>
        <tr>
            <th>Firstname</th>
            <th>Sign Up Date</th>
        </tr>
    </thead>

    <tbody>

        <tr>
            <td>Peter</td>
            <td data-order="2015-11-13 12:00">13. November 2015</td>
        </tr>
        <tr>
            <td>Daniel</td>
            <td data-order="2015-08-06 13:44">06. August 2015</td>
        </tr>
        <tr>
            <td>Michael</td>
            <td data-order="2015-10-14 16:12">14. October 2015</td>
        </tr>
    </tbody>
</table>


<script>
    $(document).ready(function() {
        $('#exampleTable').DataTable();
    });
</script>

Ich weiß, dies ist eine zwei Jahre alte Frage, aber ich fand immer noch nützlich es. Ich landete mit dem Beispielcode zur Verfügung gestellt von Fudgey, aber mit einer kleineren mod. Gespeichert mir etwas Zeit, danke!

jQuery.fn.dataTableExt.oSort['us_date-asc']  = function(a,b) { 
  var x = new Date($(a).text()),
  y = new Date($(b).text());
  return ((x < y) ? -1 : ((x > y) ?  1 : 0)); 
}; 

jQuery.fn.dataTableExt.oSort['us_date-desc'] = function(a,b) { 
  var x = new Date($(a).text()),
  y = new Date($(b).text());
  return ((x < y) ? 1 : ((x > y) ?  -1 : 0)); 
};

Ab 2015 soll der bequemste Weg, um mich nach Datum Spalte in einer Datatable zu sortieren, wird die erforderlich Art Plugin . Da das Datumsformat in meinem Fall dd/mm/yyyy hh:mm:ss war, landete ich die datum Euro mit bis Plugin . Alle braucht man zu tun ist:

Schritt 1: Fügen Sie die Sortierung Plugin

Datentabellen können nur bestellen, indem Sie auf Datetime in "ISO-8601" Format, so dass Sie Ihr Datum in "Datum Ordnung" konvertieren zu diesem Format (zB mit Razor):

<td data-sort="@myDate.ToString("o")">@myDate.ToShortDateString() - @myDate.ToShortTimeString()</td>

Für den Fall, jemand Schwierigkeiten hat, wo sie entweder in den Datumswerten oder in Zellen Leerzeichen haben, werden Sie diese Bits verarbeiten müssen. Manchmal ein leerer Raum wird nicht durch Trimmfunktion behandelt von html kommt es heißt, „$ nbsp;“. Wenn Sie diese nicht handhaben, wird Ihre Sortierung nicht richtig funktionieren, und bricht, wo immer ein leerer Raum ist.

Ich habe dieses Stück Code von jquery Erweiterungen auch hier und änderte es ein wenig meine Anforderung gerecht zu werden. Sie sollten die gleichen :) cheers tun!

function trim(str) {
    str = str.replace(/^\s+/, '');
    for (var i = str.length - 1; i >= 0; i--) {
        if (/\S/.test(str.charAt(i))) {
            str = str.substring(0, i + 1);
            break;
        }
    }
    return str;
}

jQuery.fn.dataTableExt.oSort['uk-date-time-asc'] = function(a, b) {
    if (trim(a) != '' && a!="&nbsp;") {
        if (a.indexOf(' ') == -1) {
            var frDatea = trim(a).split(' ');
            var frDatea2 = frDatea[0].split('/');
            var x = (frDatea2[2] + frDatea2[1] + frDatea2[0]) * 1;
        }
        else {
            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 = 10000000; // = l'an 1000 ...
    }

    if (trim(b) != '' && b!="&nbsp;") {
        if (b.indexOf(' ') == -1) {
            var frDateb = trim(b).split(' ');
            frDateb = frDateb[0].split('/');
            var y = (frDateb[2] + frDateb[1] + frDateb[0]) * 1;
        }
        else {
            var frDateb = trim(b).split(' ');
            var frTimeb = frDateb[1].split(':');
            frDateb = frDateb[0].split('/');
            var y = (frDateb[2] + frDateb[1] + frDateb[0] + frTimeb[0] + frTimeb[1] + frTimeb[2]) * 1;
        }
    } else {
        var y = 10000000;
    }
    var z = ((x < y) ? -1 : ((x > y) ? 1 : 0));
    return z;
};

jQuery.fn.dataTableExt.oSort['uk-date-time-desc'] = function(a, b) {
    if (trim(a) != '' && a!="&nbsp;") {
        if (a.indexOf(' ') == -1) {
            var frDatea = trim(a).split(' ');
            var frDatea2 = frDatea[0].split('/');
            var x = (frDatea2[2] + frDatea2[1] + frDatea2[0]) * 1;
        }
        else {
            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 = 10000000;
    }

    if (trim(b) != '' && b!="&nbsp;") {
        if (b.indexOf(' ') == -1) {
            var frDateb = trim(b).split(' ');
            frDateb = frDateb[0].split('/');
            var y = (frDateb[2] + frDateb[1] + frDateb[0]) * 1;
        }
        else {
            var frDateb = trim(b).split(' ');
            var frTimeb = frDateb[1].split(':');
            frDateb = frDateb[0].split('/');
            var y = (frDateb[2] + frDateb[1] + frDateb[0] + frTimeb[0] + frTimeb[1] + frTimeb[2]) * 1;
        }
    } else {
        var y = 10000000;
    }

    var z = ((x < y) ? 1 : ((x > y) ? -1 : 0));
    return z;
};

Über die update # 1 gibt es zwei Probleme:

Die Anzahl der Tage = 1 (d / Monat / Jahr) statt (TT / MM / JJJJ)
Leer Datum

Hier ist die Lösung, um diese Probleme zu vermeiden:

jQuery.fn.dataTableExt.oSort['uk_date-asc'] = function (a, b) {
            var ukDatea = a.split('/');
            var ukDateb = b.split('/');

            //Date empty
             if (ukDatea[0] == "" || ukDateb[0] == "") return 1;

            //need to change Date (d/MM/YYYY) into Date (dd/MM/YYYY) 
            if(ukDatea[0]<10) ukDatea[0] = "0" + ukDatea[0]; 
            if(ukDateb[0]<10) ukDateb[0] = "0" + ukDateb[0];

            var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
            var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

            return ((x < y) ? -1 : ((x > y) ? 1 : 0));
        };

        //Sorting by Date 
        jQuery.fn.dataTableExt.oSort['uk_date-desc'] = function (a, b) {
            var ukDatea = a.split('/');
            var ukDateb = b.split('/');

             //Date empty
             if (ukDatea[0] == "" || ukDateb[0] == "") return 1;

            //MANDATORY to change Date (d/MM/YYYY) into Date (dd/MM/YYYY) 
            if(ukDatea[0]<10) ukDatea[0] = "0" + ukDatea[0]; 
            if(ukDateb[0]<10) ukDateb[0] = "0" + ukDateb[0];

            var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
            var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

            return ((x < y) ? 1 : ((x > y) ? -1 : 0));
        };

Folgen Sie den Link https://datatables.net/blog/2014-12-18

Eine sehr einfache Möglichkeit, Ordnung nach Datum zu integrieren.

<script type="text/javascript" charset="utf8" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/plug-ins/1.10.19/sorting/datetime-moment.js"></script>

Setzen Sie diesen Code in, bevor Sie die Datentabelle zu initialisieren:

$(document).ready(function () {
    // ......
    $.fn.dataTable.moment('DD-MMM-YY HH:mm:ss');
    $.fn.dataTable.moment('DD.MM.YYYY HH:mm:ss');
    // And any format you need
}

Ich habe Lösung nach dem Einschalten es den ganzen Tag arbeiten. Es ist wenig hacky Lösung hinzugefügt Spanne innerhalb td tag

<td><span><%= item.StartICDate %></span></td>.

Datumsformat, das Im mit ist TT / MM / JJJJ. Getestet in Datatables1.9.0

Erstellen Sie eine versteckte Spalte „Datumnach“ (zum Beispiel) mit dem Datum als Zeichenfolge mit dem Format „yyyyMMddHHmmss“ und verwenden Sie die Eigenschaft „orderdata“ zu Punkt auf diese Spalte.

var myTable = $("#myTable").dataTable({
 columns: [
      { data: "id" },
      { data: "date", "orderData": 4 },
      { data: "name" },
      { data: "total" },
      { data: "dateOrder", visible: false }
 ] });

Lizenziert unter: CC-BY-SA mit Zuschreibung

Nicht verbunden mit StackOverflow