2012-07-02 1 views
0

Нужна помощь в удалении стрелок сортировки (asc и desc) в строке заголовка таблиц данных, а затем, когда пользователь нажимает на столбец заголовка, появляется стрелка возрастания и, конечно же, данные будут сортироваться в порядке возрастанияСортировка стрелок в подлежащих удалению данных

ответ

4
$("#MyDataTable").dataTable({    
"aoColumns": [{"bSortable": false}, null]   
}); 
0

что я получил от вашего вопроса в том, что вы хотите, чтобы удалить первоначальный вид из таблицы и только сортировать, когда пользователь нажимает на заголовок столбца. Вы можете сделать это, используя следующий код:

$(document).ready(function() { 
    $('#example').dataTable({ 
    "aaSorting": [] 
    }); 
}); 

http://datatables.net/ref#aaSorting

1

В dataTables.Bootstrap.css три класса, которые добавляют эти сортировки изображений. Они сортируют, sorting_asc и sorting_desc. Во время инициализации DataTable отключить сортировку, как указано выше, «satej kumar sahu» через bSortable: false. Затем сделайте deleteClass для заголовка, мой заголовок имеет id = "division". Затем создайте событие click для заголовка, то же id, чтобы сделать другой removeClass, чтобы сохранить любую другую функциональность, в моем случае, чтобы сохранить раскрывающийся столбец через columnFilter. Просмотрите прилагаемый код.

$('#example').dataTable({ 
 
      "order": [[1, "asc"], [7, "asc"], [4, "asc"]], 
 
      "aoColumnDefs": [{ "bSortable": false, "aTargets": [1]}], 
 
      "columns":[null, {className: ""}, null, null, null , null, null, null, null, null] 
 
     }).columnFilter({ 
 
      sPlaceHolder: "head:after", 
 
      aoColumns: [null, { type: "select" }, null, 
 
      null, null, null, null, null, null, null] 
 
     }); 
 
     $('#division').removeClass('sorting sorting_asc sorting_desc'); 
 

 

 
$('#division').click(function() { 
 
     \t \t  $('#division').removeClass('sorting sorting_asc sorting_desc'); 
 
     \t \t });
table.dataTable thead .sorting { background: url('../images/sort_both.png') no-repeat center right; } 
 
table.dataTable thead .sorting_asc { background: url('../images/sort_asc.png') no-repeat center right; } 
 
table.dataTable thead .sorting_desc { background: url('../images/sort_desc.png') no-repeat center right; }
<thead> 
 
        <tr class="info">          
 
\t \t \t \t \t  <th scope="col">Title</th> 
 
\t \t \t \t \t  <th id="division" scope="col">Division</th>       
 
         <th scope="col">Attendee</th> 
 
         <th scope="col">Supervisor</th> 
 
\t \t \t \t \t  <th scope="col">Start Date</th> 
 
\t \t \t \t \t  <th scope="col">End Date</th> 
 
         <th scope="col">Duration(hr)</th> 
 
\t \t \t \t \t  <th scope="col">Fee</th> 
 
         <th scope="col">Status</th> 
 
         <th scope="col">Comments</th> \t \t \t \t \t  
 
        </tr>  
 
       </thead>

1
> This is Best Answer for removing sort arrow 
> 
> 
> $('#itjbg-table').dataTable({ 
>  'columnDefs': [{ 'orderable': false, 'targets': 0 }], // hide sort icon on header of first column 
>  'aaSorting': [[1, 'asc']] // start to sort data in second column }); 
0

КАК УДАЛИТЬ DataTables GLYPHCONS/ИКОНЫ !!


Используйте этот следующий код в файле css: , если вы видите столбец glyph-cons в заголовке таблицы, используйте это!

th.sorting_asc::after, th.sorting_desc::after { content:"" !important; }

Если вы видите глиф-минусы в данных таблицы, используйте это!

td.sorting_asc::after, td.sorting_desc::after { content:"" !important; }

в коротких изменениях "это" части, где класса = "sorting_desc/по возрастанию", расположенная по адресу.

"this".sorting_asc::after, "this".sorting_desc::after { content:"" !important; }