it-swarm.com.de

Datierbare Datums-Sortierung TT/MM/JJJJ Ausgabe

Ich verwende ein Jquery-Plugin namens datatables

Es ist fantastisch, aber ich kann die Datumsangaben nicht dazu bekommen, richtig nach dem Format TT/MM/JJJJ zu sortieren.

Ich habe mir ihre Supportformate angesehen, aber keine dieser Korrekturen scheint zu funktionieren.

Kann mir jemand hier bitte helfen?

48
jaget

jQuery-Lösung

Hier ist funktionierende jQuery-Lösung .

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"date-uk-pre": function ( a ) {
    var ukDatea = a.split('/');
    return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
},

"date-uk-asc": function ( a, b ) {
    return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},

"date-uk-desc": function ( a, b ) {
    return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
} );

Fügen Sie den obigen Code zum Skript hinzu und setzen Sie die spezifische Spalte mit Datumswerten mit { "sType": "date-uk" } und anderen auf null, siehe unten:

$(document).ready(function() {
    $('#example').dataTable( {
        "aoColumns": [
            null,
            null,
            null,
            null,
            { "sType": "date-uk" },
            null
        ]
    });
    });

CSS-Lösung

Wenn Sie eine schnelle Lösung wünschen, können Sie einfach den tatsächlichen DateTime-Wert in jeder Zeile im spezifischen Format (YYYYMMDD) anhängen und ihn mithilfe von CSS ausblenden. Dadurch können Sie diese Spalte ohne Javascript-Änderung sortieren.

Hier ist funktionierende CSS-Lösung

HTML

<td><span class='hide'>YYYYMMDD</span>DD/MM/YYYY</td>

CSS

.hide {
    display:none; 
}
95
Zaheer Ahmed

Date Sort - mit einem versteckten Element

Konvertieren Sie das Datum in das FormatYYYYMMDDund stellen Sie den tatsächlichen Wert ( DD/MM/YYYY ) im <td> voran, wickeln Sie es in ein Element ein und setzen Sie den Elementen den Stil display:none;. Die Datumssortierung funktioniert jetzt wie eine normale Sortierung. Dasselbe kann auf die Sortierung nach Datum und Uhrzeit angewendet werden.

HTML 

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

CSS 

#data-table span {
    display:none; 
}
64
Anulal S

Ich weiß, das ist eine alte Frage und die Antworten sind auch alt. Vor kurzem bin ich auf eine einfache und saubere Art gestoßen, Termine zu sortieren. Dies kann durch das HTML5-Attribut data-order zum <td>-Element erfolgen.

Folgendes habe ich in meinem PHP gemacht:

<?php
$newdate = date('d M Y', $myDateTime); // Format in which I want to display
$dateOrder = date('Y-m-d', $myDateTime); // Sort Order
?>

<td data-order="<?php echo $dateOrder; ?>" >
<?php echo $newdate; ?>
</td>
27
maxx777

Probieren Sie dieses Plugin aus. 

Wie in here angegeben, müssen Sie Moment.js und das datatable-moment-Plugin einfügen und dann das Datumsformat angeben, das Sie verwenden .. _ Das Plugin erkennt Ihre Datumsspalten automatisch und sortiert sie nach diesem sollte ..__ sein. Für Erläuterungen zum Moment.js-Format, überprüfen Sie hier .

Beispiel:

$(document).ready(function() {
    $.fn.dataTable.moment('DD/MM/YYYY HH:mm');
    $('#example').DataTable();
});
6
mineroot

in PHP oder Js übergeben Sie einfach ein Array und verwenden Sie orthogonal, wie:

$var[0][0] = "like as u wish, 30/12/2015 or something else";
$var[0][1] = strtotime($your_date_variable);

und in datierbar ...

$('#data-table-contas_pagar').dataTable({
    "columnDefs": [
        {"targets":[0],"data": [0],"render": {"_": [0],"sort": [1]}}
    ]
});
1
labplace

Wenn Sie momentum.js oder ein anderes Datumsformat nicht verwenden möchten, können Sie dem Datumswert ein Datumsformat in Millisekunden voranstellen, damit die Sortierung nach Millisekunden gelesen wird. Und blenden Sie das Millisekunden-Datumsformat aus.

Beispielcode:  

var date = new Date();
var millisecond = Date.parse(date);

HTML

<td>'<span style="display: none;">' + millisecond + "</span>" + date + </td>

Das ist es.

1
CherryBlossom

Eine andere Lösung: https://datatables.net/blog/2014-12-18

mit 2 javascripts-libs: // cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js und // cdn.datatables.net/plug-ins/1.10.15/sorting/datetime-moment.js

dann nur das:

$ (Dokument) .ready (Funktion () {

$.fn.dataTable.moment( 'DD/MM/YYYY' );

$('#example').DataTable(); 

});

1
Patrikoko

Auf diese Weise hat es bei mir funktioniert.

<td data-order="@item.CreatedOn.ToString("MMddyyyyHHmmss")">
    @item.CreatedOn.ToString("dd-MM-yyyy hh:mm tt")
</td>

Dieses Datumsformat im Attribut data-order Sollte in diesem Format vorliegen, das von DataTable unterstützt wird.

1
Reyan Chougle

Was für mich zu funktionieren scheint, war 

Schieben Sie das vollständige datetime-Objekt ab, das mit einer Auswahlabfrage aus meiner Datenbank abgerufen wird, und zwar in einem Datensatz, der im datierbaren Format "2018-01-05 08:45:56" gezeichnet wird.

dann

    $('#Table').DataTable({
        data: dataset,
        deferRender: 200,
        destroy: true,
        scrollY: false,
        scrollCollapse: true,
        scroller: true,
        "order": [[2, "desc"]],
        'columnDefs': [
            {
                'targets': 2,
                'createdCell':  function (td, cellData, rowData, row, col) {                        
                    var datestamp = new Date(cellData);
                    $(td).html(datestamp.getUTCDate() + '-' + (datestamp.getMonth()+1) + '-' + datestamp.getFullYear());
                }
            }
        ],
        "initComplete": function(settings, json) {
            $($.fn.dataTable.tables(true)).DataTable()
                .columns.adjust();               
        }
    });

Zeilen werden richtig sortiert, dann bekomme ich eine HTML, die ich in der Zeile haben möchte

0
Gringo

Für die Spalte, die Sie bestellen möchten, behalten Sie "sType": "date-uk" Zum Beispiel: -"data": "OrderDate", "sType": "date-uk" Nach Abschluss des Datatable-Skripts in ajax behalten Sie den folgenden Code

 jQuery.extend(jQuery.fn.dataTableExt.oSort, {
            "date-uk-pre": function (a) {
                var ukDatea = a.split('/');
                return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
            },

            "date-uk-asc": function (a, b) {
                return ((a < b) ? -1 : ((a > b) ? 1 : 0));
            },

            "date-uk-desc": function (a, b) {
                return ((a < b) ? 1 : ((a > b) ? -1 : 0));
            }
        });

Dann erhalten Sie ein Datum als 22-10-2018 in diesem Format

0
vidya

Ich wollte darauf hinweisen, dass bei der Verwendung von Daten vom Server über Ajax die Lösung super einfach ist, jedoch nicht sofort ersichtlich ist.

Bei der Rückgabe des Sortierreihenfolge-Arrays sendet Datatables (im $_POST) ein 2-Element-Array, dasentspricht:

$_POST['order'][0] =array('column'=>'SortColumnName', 'dir'=>'asc'); 
// 2nd element is either 'asc' or 'desc'

Daher können Sie das Datum in jedem gewünschten Format anzeigen. Lassen Sie Ihren Server die Sortierkriterien nur basierend auf der Variablen sortColumnName zurückgeben.

Beispielsweise verwende ich in PHP (mit MySQL) Folgendes:

 if (isset($_POST['order'])) {
          switch ($_POST['order'][0]['column']) {
               case 0:// sort by Primary Key
                    $order = 'pkItemid';
                    break;
               case 1:// Sort by reference number
                    $order = 'refNo';
                    break;
               case 2://Date Started
                    $order = 'dOpen';
                    break;
               default :
                    $order = 'pkItemid';
          }
          $orderdir = ($_POST['order'][0]['dir'] === 'desc') ? 'desc' : 'asc';
     }

Da nichts von $_POST an $order oder $orderdir übergeben wird, ist kein Cross-Script-Angriff möglich.

Jetzt einfach an eine MySQL-Abfrage anhängen:

$sql ="SELECT pkItemid, refNo, DATE_FORMAT(dOpen,'%b %e, %Y') AS dateStarted
       FROM tblReference 
       ORDER BY $order $orderdir;";

führen Sie die Abfrage aus, und geben Sie in json nur den Wert dateStarted an Datatables zurück.

0
Sablefoste

Wenn Sie Ihre Datumsangaben aus einer Datenbank abrufen und für jede Zeile eine for-Schleife ausführen und sie an eine Zeichenfolge anhängen, die in Javascript verwendet werden soll, um Daten automatisch zu füllen, muss dies folgendermaßen aussehen. Beachten Sie, dass Sie bei Verwendung des Tricks mit ausgeblendetem Bereich die einstelligen Zahlen des Datums berücksichtigen müssen, z. B. wenn es die sechste Stunde ist. Sie müssen eine Null hinzufügen, bevor der Trick sonst nicht in der Sortierung funktioniert Beispiel für Code:

 DateTime getDate2 = Convert.ToDateTime(row["date"]);
 var hour = getDate2.Hour.ToString();
 if (hour.Length == 1)
 {
 hour = "0" + hour;
 }
 var minutes = getDate2.Minute.ToString();
 if (minutes.Length == 1)
 {
 minutes = "0" + minutes;
 }
 var year = getDate2.Year.ToString();
 var month = getDate2.Month.ToString();
 if (month.Length == 1)
 {
 month = "0" + month;
 }
 var day = getDate2.Day.ToString();
 if (day.Length == 1)
 {
 day = "0" + day;
 }
 var dateForSorting = year + month + day + hour + minutes; 
 dataFromDatabase.Append("<span style=\u0022display:none;\u0022>" + dateForSorting +
 </span>");
0
NC25

Der einfachste Weg, dieses Problem zu lösen

Ändern Sie einfach Ihr Design ein bisschen so 

//Add this data order attribute to td
<td data-order="@item.CreatedOn.ToUnixTimeStamp()">
                                    @item.CreatedOn
                                </td>
                                
                                
               
               Add create this Date Time helper function
// #region Region 
 public static long ToUnixTimeStamp(this DateTime dateTime) {
 TimeSpan timeSpan = (dateTime - new DateTime(1970, 1, 1, 0, 0, 0));
     return (long)timeSpan.TotalSeconds;
     } 
     #endregion

0
Rohit Manocha

Schauen Sie sich diese offizielle DataTable-Lösung mit Moment.js an:

Ultimatives Plug-In für Datum und Uhrzeit

https://datatables.net/blog/2014-12-18

0
Wesley Pimentel

Ich habe im Rest Call benutzt

** Datumsvariable ist: Erstellt **

var call = $.ajax({
            url: "../_api/Web/Lists/GetByTitle('NewUser')/items?$filter=(Created%20ge%20datetime'"+FromDate+"')%20and%20(Created%20le%20datetime'"+ToDate+"' and Title eq '"+epf+"' )&$top=5000",
            type: "GET",
            dataType: "json",
            headers: {
                Accept: "application/json;odata=verbose"
            }

            });

  call.done(function (data,textStatus, jqXHR){
        $('#example').dataTable({
            "bDestroy": true,
            "bProcessing": true,
            "aaData": data.d.results,
            "aLengthMenu" : [
             [50,100],
             [50,100]
            ],
             dom: 'Bfrtip',
            buttons: [
                'copy', 'csv', 'Excel'
            ],

            "aoColumnDefs": [{ "bVisible": false  }],
            "aoColumns": [
                { "mData": "ID" },
                { "mData": "Title" },
                { "mData": "EmployeeName" },
                { "mData": "Department1" },
                { "mData": "ServicingAt" },
                { "mData": "TestField" }, 
                { "mData": "BranchCode" },   
                { "mData": "Created" ,"render": function (data, type, row) {
        data = moment(data).format('DD MMM YYYY');
        return data;
    }
0
MAFAIZ

Versuche dies:

"aoColumns": [
        null,
        null,
        null,
        null,
        {"sType": "date"},  //  "sType": "date" TO SPECIFY SORTING IS APPLICABLE ON DATE
        null
      ]
0
Nikhil Gyan

verwenden Sie dieses Snippet!

$(document).ready(function() {
 $.fn.dataTable.moment = function ( format, locale ) {
    var types = $.fn.dataTable.ext.type;

    // Add type detection
    types.detect.unshift( function ( d ) {
        return moment( d, format, locale, true ).isValid() ?
            'moment-'+format :
            null;
    } );

    // Add sorting method - use an integer for the sorting
    types.order[ 'moment-'+format+'-pre' ] = function ( d ) {
        return moment( d, format, locale, true ).unix();
    };
};

$.fn.dataTable.moment('DD/MM/YYYY');

$('#example').DataTable();
});

sobald js für alle Datums- und Zeitformate geeignet ist, fügen Sie diesen Snipper hinzu, bevor Sie die Datentabelle wie zuvor initialisieren.

Denken Sie auch daran, die http://momentjs.com/ zu laden.

0
Anit Bibin

Ich habe das versucht und für mich gearbeitet.

https://github.com/sedovsek/DataTables-EU-date-Plug-In

Ich habe den Formatmodus .ToString("dd/MM/yyyy"); verwendet, der dann in meinem jQuery.Datatable funktioniert.

jQ unten

oTable = $('#grid').dataTable({
    "sPaginationType": "full_numbers",
    "aoColumns": [
        { "sType": "eu_date" },
        null
    ]
});
});

Die Spalte, die Sie mit Datum haben, sollten Sie mit dem sType wie dem obigen Code definieren.

0
Marcelo

Diese Lösung ist völlig falsch. Sie können ein Datum nicht in eine Zahl konvertieren, indem Sie einfach jede Komponente des Datums hinzufügen. Wenn Sie diese Logik beispielsweise mit den folgenden Datumsangaben versuchen, werden Sie feststellen, dass sie nicht richtig übereinstimmt: 

20/01/2014 = 2035 15/02/2014 = 2031

Hexendatum steht an erster Stelle, aufsteigend? 20 Januar Nicht nach dieser Logik: P

Die korrekte Methode der Methode parsedate besteht darin, die Zeichenfolge in eine gültige Datumszeit umzuwandeln, und sie verwenden die Funktion getTime, um die Tabelle richtig anzuordnen.

var day = a.split('/')[0]
var month = a.split('/')[1]
var year = a.split('/')[2]

var date = new Date(month + "/" + day + "/" + year)
return date.getTime()
0
Stormhashe

Der einfachste Weg zum Sortieren ist in diesem Fall das Hinzufügen der Option "aaSorting" in der JS. 

Zum Beispiel:

$(document).ready(function() {
    $('#contacts-table').dataTable({
        "aaSorting": [0, 'desc']
});

Das Problem hierbei ist, dass dieses Beispiel Einträge aus der ersten Spalte wie STRING, aber nicht nach Datumsangaben sortiert. Wenn Sie mit dem Quellcode das Datumsformat von TT/MM/JJJJ in JJJJ/MM/TT ändern können, funktioniert "aaSorting" ordnungsgemäß für Sie.

0
Boris Georgiev

Die Lösung von Zaheer Ahmed funktioniert gut, wenn Sie mit dem bereits formatierten Datum arbeiten müssen. 

Ich hatte ein Problem mit dieser Lösung, da ich das in den USA formatierte Datum verwalten musste. 

Ich habe es mit dieser kleinen Veränderung herausgefunden: 

function parseDate(a) {
    var ukDatea = a.split('/');
    return (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
}

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
    "date-uk-pre": function ( a ) {
        return parseDate(a);
    },

    "date-uk-asc": function ( a, b ) {
        a = parseDate(a);
        b = parseDate(b);
        return ((a < b) ? -1 : ((a > b) ? 1 : 0));
    },

    "date-uk-desc": function ( a, b ) {
        a = parseDate(a);
        b = parseDate(b);
        return ((a < b) ? 1 : ((a > b) ? -1 : 0));
    }
});

Gefolgt von Ihrer "aoColumns" -Definition.

0
Yobac

Problemquelle ist das datetime-Format.

Falsche Beispiele: "MM-TT-JJJJ H: mm", "MM-TT-JJJJ"

Richtiges Beispiel: "MM-TT-JJJJ HH: mm"

0
Serdar KUŞ

Sie können dieses Problem mit PHP lösen.

$mydate = strtotime($startdate);
$newformat = date('d-m-Y',$mydate);
echo '<tr>';
echo '  <td data-sort="'. $mydate .'">'.$newformat .'</td>';
0
augustine jenin

Verwenden Sie das data-order-Attribut für das <td>-Tag wie folgt ( Ruby Example )

    <td data order='<%=rentroll.decorate.date%>'><%=rentroll.decorate.date%></td>

Ihre Dekorateurfunktion wäre hier:

    def date
    object.date&.strftime("%d/%m/%Y")
    end
0
aabiro

Am einfachsten ist es, in jedem TD - Tag der Spalte einen versteckten Zeitstempel vor dem Datum hinzuzufügen. Beispiel:

<td class="sorting_1">
    <span class="d-none">1547022615</span>09/01/2019  09:30
</td>

Bei der Standard-Reihenfolge der Zeichenfolgen ordnet ein Zeitstempel die Spalte wie gewünscht ein und wird beim Rendern im Browser nicht angezeigt.

0
joan16v

Ich habe auch das gleiche Problem.

Ich habe span mit in td wie 21.03.2017 verwendet, indem datata dies als String behandelte und die Sortierung nicht funktionierte.

Ich habe span in td entfernt und es wurde behoben . Wie, 21.03.2017

0
Srinivas Ch