отключить сортировку столбцов с помощью jquery datatables

Question

Я использую плагин jQuery datatables для сортировки полей таблицы. У меня вопрос, как отключить сортировку для определенного столбца? Я попытался с помощью следующего кода, но он не работал:

"aoColumns": [
    { "bSearchable": false },
    null
]   

Я также попробовал следующий код:

"aoColumnDefs": [
     { "bSearchable": false, "aTargets": [ 1 ] }
 ]

но это все равно не дало желаемых результатов.

Answer 1

Если вы установите для свойства FIRST column orderable значение false, вы должны также установить столбец по умолчанию order, иначе он не будет работать, так как первый столбец является столбцом порядка по умолчанию. Пример ниже отключает сортировку по первому столбцу, но устанавливает второй столбец в качестве столбца порядка по умолчанию (помните, что индексы dataTables основаны на нуле).

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

Answer 2

Чтобы обновить ответ Бхавиша (который, я думаю, относится к более старой версии DataTables и не работает для меня). Я думаю, что они изменили имя атрибута. Попробуйте это:

<thead>
    <tr>
        <td data-sortable="false">Requirements</td>
        <td data-sortable="false">Automated</td>
        <td>Created On</td>
    </tr>
</thead>
<tbody>
    <tr>
        <td>

Answer 3

"aoColumnDefs" : [   
{
  'bSortable' : false,  
  'aTargets' : [ 0 ]
}]

Здесь 0 - это индекс столбца. Если вы хотите, чтобы несколько столбцов не сортировались, укажите значения индекса столбца, разделенные comma(,)

Answer 4

Это работает для меня для одного столбца

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

Answer 5

Используя класс:

<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>

Теперь вы можете присвоить классу "nosort"

Answer 6

Есть два способа, один определяется в html при определении заголовков таблицы

<thead>
  <th data-orderable="false"></th>
</thead>

Другой способ - использование javascript, например, у вас есть таблица

<table id="datatables">
    <thead>
        <tr>
            <th class="testid input">test id</th>
            <th class="testname input">test name</th>
    </thead>
</table>

, затем:

$(document).ready(function() {
    $('#datatables').DataTable( {
        "columnDefs": [ {
            "targets": [ 0], // 0 indicates the first column you define in <thead>
            "searchable": false
        }
        , {
            // you can also use name to get the target column
            "targets": 'testid', // name is the class you define in <th>
            "searchable": false
        }
        ]
    }
    );
}
);

Answer 7

Вы можете напрямую использовать метод .notsortable () для столбца

 vm.dtOpt_product = DTOptionsBuilder.newOptions()
                .withOption('responsive', true)
        vm.dtOpt_product.withPaginationType('full_numbers');
        vm.dtOpt_product.withColumnFilter({
            aoColumns: [{
                    type: 'null'
                }, {
                    type: 'text',
                    bRegex: true,
                    bSmart: true
                }, {
                    type: 'text',
                    bRegex: true,
                    bSmart: true
                }, {
                    type: 'text',
                    bRegex: true,
                    bSmart: true
                }, {
                    type: 'select',
                    bRegex: false,
                    bSmart: true,
                    values: vm.dtProductTypes
                }]

        });

        vm.dtColDefs_product = [
            DTColumnDefBuilder.newColumnDef(0), DTColumnDefBuilder.newColumnDef(1),
            DTColumnDefBuilder.newColumnDef(2), DTColumnDefBuilder.newColumnDef(3).withClass('none'),
            DTColumnDefBuilder.newColumnDef(4), DTColumnDefBuilder.newColumnDef(5).notSortable()
        ];

Answer 8

1. Используйте следующий код для отключения порядка в первом столбце:

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

2. Чтобы отключить порядок по умолчанию, вы также можете использовать:

   $('#example').dataTable( {
        "ordering": false, 
   } );
   

Answer 9

Если вам уже нужно скрывать некоторые столбцы, например, я скрываю фамилию столбца.Мне просто нужно было объединить fname, lname, поэтому я сделал запрос, но скрыл этот столбец от внешнего интерфейса.Модификации в отключить сортировку в такой ситуации:

    "aoColumnDefs": [
        { 'bSortable': false, 'aTargets': [ 3 ] },
        {
            "targets": [ 4 ],
            "visible": false,
            "searchable": true
        }
    ],

Обратите внимание, что у меня здесь была скрытая функция

    "columnDefs": [
            {
                "targets": [ 4 ],
                "visible": false,
                "searchable": true
            }
        ],

Затем я слил ее в "aoColumnDefs"

Answer 10

установить класс "no-sort" в таблице, затем добавить css .no-sort {pointer-events: none! Важный;курсор: по умолчанию! важный; фоновое изображение: нет! важный;} этим он будет скрывать событие обновления и отключения стрелки в голове.