DataTables Legen Sie die Standard-Sortierspalte fest und legen Sie unsortierbare Spalten fest

Lesezeit: 4 Minuten

Benutzer-Avatar
Pierce McGeough

Ist es möglich, die Standardspalte so einzustellen, dass sie nach dem Laden der Seite sortiert wird? Ich möchte den einen Datatable-Aufruf für verschiedene Tabellen auf meiner Website verwenden. Ist es möglich, eine hinzuzufügen th Klasse, um dies zu erreichen?

Ich möchte auch die Sortierung für einige Spalten deaktivieren und da ich nach dem einen Datatables-Aufruf suche, um alles zu tun, gibt es eine Klasse, die ich dem th hinzufügen kann, die es unsortierbar macht?

Dies ist mein aufgerufenes dataTable-Skript

if (jQuery().dataTable) {
    $('#table-list-items').dataTable({
        "fnDrawCallback" : function () {
        },
        "aLengthMenu": [
        [10, 15, 25, 50, 100, -1],
        [10, 15, 25, 50, 100, "All"]
        ],
        "iDisplayLength": 25,
        "oLanguage": {
            "sLengthMenu": "_MENU_ Records per page",
            "sInfo": "_START_ - _END_ of _TOTAL_",
            "sInfoEmpty": "0 - 0 of 0",
            "oPaginate": {
                "sPrevious": "Prev",
                "sNext": "Next"
            }
        },
        "aoColumnDefs": [{
            'bSortable': true,
            'aTargets': [0]
        }]
    });
}

  • Sehen Sie sich diese Lösung für “unsortierbare” Spalten an: stackoverflow.com/a/20547339/1430996

    – Jeromy French

    16. Dezember 2013 um 16:37 Uhr

Benutzer-Avatar
Vorschau

Gemäß der Tabellensortierung docs das kannst du mit machen order Möglichkeit:

$('.table-asc0').dataTable({
  order: [[0, 'asc']]
})

Die 0 gibt an, dass nach der ersten Spalte sortiert werden soll, während asc um es in aufsteigender Reihenfolge zu tun. Sie können jede andere Spalte auswählen und verwenden desc zu.


Für DataTables-Versionen vor 1.10 du solltest benutzen aaSorting stattdessen

$('.table-asc0').dataTable({
  aaSorting: [[0, 'asc']]
})

So sortieren Sie in der ersten Spalte absteigend:

$('.table-asc1').dataTable({
  aaSorting: [[1, 'desc']]
})

  • Danke, aber ich habe viele Tabellen und in einigen von ihnen muss möglicherweise die 2. oder 4. Spalte sortiert werden. Ist es möglich, dies zu tun, indem Sie einfach eine Klasse hinzufügen?

    – Pierce McGeough

    28. November 2013 um 10:29 Uhr

  • Da Sie auf Elemente abzielen und eine DataTable mit Parametern aktivieren können, sollten Sie Datatables für die differents-Klasse mit unterschiedlichen Parametern aufrufen, siehe update.

    – Vorschau

    28. November 2013 um 10:32 Uhr

  • Ja, das habe ich bisher gemacht. Ich wollte sehen, ob es einen Weg gibt, stattdessen Klassen in HTML zu verwenden.

    – Pierce McGeough

    28. November 2013 um 10:35 Uhr

  • Als würde man DataTables nur einmal aufrufen, aber mit unterschiedlichen Parametern?

    – Vorschau

    28. November 2013 um 10:40 Uhr

  • Unterschiedliche IDs verwenden $(‘#table-list-items’).dataTable({ und $(‘#table-activity-log’).dataTable({

    – Pierce McGeough

    28. November 2013 um 10:41 Uhr

Benutzer-Avatar
Gyrocode.com

ERSTBESTELLUNG EINSTELLEN (Datentabellen 1.10)

Verwenden order um die anfängliche Reihenfolge der Tabelle festzulegen.

So sortieren Sie beispielsweise nach der zweiten Spalte in absteigender Reihenfolge:

$('#example').dataTable({
   "order": [[ 1, 'desc' ]]
});

Sehen diese jsFiddle für Code und Demonstration.


SORTIERUNG FÜR EINE SPALTE DEAKTIVIEREN (Datentabellen 1.10)

Verwenden columnDefs und orderable um die Sortierung für bestimmte Spalten zu deaktivieren.

So deaktivieren Sie beispielsweise die Sortierung in der dritten und vierten Spalte:

$('#example').dataTable({
   "columnDefs": [
      { "targets": [2,3], "orderable": false }
  ]
});

Sehen diese jsFiddle für Code und Demonstration.


ANFANGSREIHENFOLGE FESTLEGEN UND SORTIERUNG FÜR GLEICHE SPALTE DEAKTIVIEREN (Datentabellen 1.10)

Sie können kombinieren order Option zum Festlegen der anfänglichen Reihenfolge der Tabelle und orderable um die Sortierung in derselben Spalte zu deaktivieren.

Zum Beispiel:

$('#example').dataTable({
   "order": [[ 0, 'desc' ]],
   "columnDefs": [
      { "targets": [0], "orderable": false }
  ]
});

Sehen diese jsFiddle für Code und Demonstration.

  • wie wäre es, dasselbe zu tun?

    – Herr J

    29. Mai 2017 um 5:14 Uhr

  • und wie kann man BEIDES machen? Ich habe die Bestellung in meiner Spalte 0 deaktiviert, möchte aber, dass die anfängliche Bestellung genau in dieser Spalte erfolgt … aber nichts passiert

    – Entwickler

    20. März 2018 um 16:22 Uhr

Dies können Sie über die data-order data -Attribut im Tabellen-HTML, das Ihnen die Flexibilität gibt, die Sie auf Tabellenbasis benötigen, während Sie dennoch einen einzigen Aufruf verwenden können, um Ihre dataTables zu initialisieren:

<table className="table table-condensed table-striped" data-order="[[ 2, &quot;asc&quot; ]]" id="tableId">
    <thead>
        <tr>
          <th>Col1</th>
          <th>Col2</th>
          <th>Col3</th>
          <th>Col4</th>
          <th>Col5</th>
          <th>Col6</th>
        </tr>
    </thead>
    <tbody>
        <tr>
          <td>Val1</td>
          <td>Val2</td>
          <td>Val3</td>
          <td>Val4</td>
          <td>Val5</td>
          <td>Val6</td>
        </tr>
    </tbody>
</table>

  • Stellen Sie für diejenigen, die diese Technik beheben, sicher, dass Sie Kleinbuchstaben verwenden "asc" und "desc".

    – Jeromy French

    28. Januar 2019 um 23:30 Uhr

Fügen Sie einfach den folgenden Code ein:

    $(document).ready(function() {
        $('#tableID').DataTable( {
            "order": [[ 3, "desc" ]]
        } );
    } 
);

Bezug:

https://datatables.net/examples/basic_init/table_sorting.html

ist korrekt und funktioniert:

    $('#admin').DataTable({
        "aaSorting": [[3, 'desc']],
        "bPaginate": true,
        "bProcessing": true,
        "columns": [
            {'data' : 'request_code'},
            {'data' : 'name_receiver'},
            {'data' : 'name_area'},
            {'data' : 'created_at'},
            {'data' : 'state'},
            {'data' : 'city'},
            {'data' : 'history'},
        ],
        "ajax": "{{route('my.route.name')}}",
        dom: 'Bfrtip',
        buttons: ['copy', 'excel', 'print'],
    });

1216120cookie-checkDataTables Legen Sie die Standard-Sortierspalte fest und legen Sie unsortierbare Spalten fest

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy