Disable sorting for a particular column in jQuery DataTables

前端 未结 23 1496
礼貌的吻别
礼貌的吻别 2020-11-30 19:58

I am using the jQuery DataTables plugin to sort the table fields. My question is: how do I disable sorting for a particular column? I have tried with the following code, but

相关标签:
23条回答
  • 2020-11-30 20:49

    For Single column sorting disable try this example :

    <script type="text/javascript">                         
        $(document).ready(function() 
        {
            $("#example").dataTable({
               "aoColumnDefs": [
                  { 'bSortable': false, 'aTargets': [ 0 ] }
               ]
            });
        });                                         
    </script>
    

    For Multiple columns try this example: you just need to add column number. By default it's starting from 0

    <script type="text/javascript">                         
        $(document).ready(function() 
        {
            $("#example").dataTable({
               "aoColumnDefs": [
                  { 'bSortable': false, 'aTargets': [ 0,1,2,4,5,6] }
               ]
            });
        });                                         
    </script>  
    

    Here only Column 3 works

    0 讨论(0)
  • 2020-11-30 20:51

    columnDefs now accepts a class. I'd say this is the preferred method if you'd like to specify columns to disable in your markup:

    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th class="datatable-nosort">Actions</th>
            </tr>
        </thead>
        ...
    </table>
    

    Then, in your JS:

    $("table").DataTable({
        columnDefs: [{
            targets: "datatable-nosort",
            orderable: false
        }]
    });
    
    0 讨论(0)
  • 2020-11-30 20:52

    To make a first column sorting disable, try with the below code in datatables jquery. The null represents the sorting enable here.

    $('#example').dataTable( {
      "aoColumns": [
      { "bSortable": false },
      null,
      null,
      null
      ]
    } );
    

    Disable Sorting on a Column in jQuery Datatables

    0 讨论(0)
  • 2020-11-30 20:52

    Using class:

    <table  class="table table-datatable table-bordered" id="tableID">
        <thead>
            <tr>
                <th class="nosort"><input type="checkbox" id="checkAllreInvitation" /></th>
                <th class="sort-alpha">Employee name</th>
                <th class="sort-alpha">Send Date</th>
                <th class="sort-alpha">Sender</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td><input type="checkbox" name="userUid[]" value="{user.uid}" id="checkAllreInvitation" class="checkItemre validate[required]" /></td>
                <td>Alexander Schwartz</td>
                <td>27.12.2015</td>
                <td>dummy@email.com</td>
            </tr>
        </tbody>
    </table>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#tableID').DataTable({
                'iDisplayLength':100,
                "aaSorting": [[ 0, "asc" ]],
                'aoColumnDefs': [{
                    'bSortable': false,
                    'aTargets': ['nosort']
                }]
            });
        });
    </script>
    

    Now you can give "nosort" class to <TH>

    0 讨论(0)
  • 2020-11-30 20:54

    To update Bhavish's answer (which I think is for an older version of DataTables and didn't work for me). I think they changed the attribute name. Try this:

    <thead>
        <tr>
            <td data-sortable="false">Requirements</td>
            <td data-sortable="false">Automated</td>
            <td>Created On</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
    
    0 讨论(0)
提交回复
热议问题