2014-10-28 3 views
1

Я использую плагин jQuery для DataTable (http://datatables.net/), и я бы хотел отключить порядок по умолчанию каждого столбца при нажатии на элемент TH и вместо этого указать другой элемент для заказа (который будет быть ребенком каждого TH).Как использовать jQuery DataTables listener

У меня есть это в JS

var table = $('.table-striped').DataTable({ 
    "ordering": false 
    }); 
table.order.listener($('#sort'), 1); 

И это в HTML

<table class="table table-striped" cellspacing="0" width="100%"> 
     <thead> 
     <tr> 
      <th><span id="sort">Col 1</span></th> 
      <th>Col 2</th> 
      <th>Col 3</th> 
     </tr> 
     </thead> 

     <tbody> 
     <tr> 
      <td><span>2</span></td> 
      <td><span>CHARLIE</span></td> 
      <td><span>DELTA</span></td> 
     </tr> 
     <tr> 
      <td><span>1</span></td> 
      <td><span>ALPHA</span></td> 
      <td><span>BETA</span></td> 
     </tr> 
     </tbody> 

Fiddle

Поэтому я считаю, что при нажатии на SPAN с идентификатором «сортировать ', таблица должна быть отсортирована по столбцу 1, но это не так :(Любые идеи? ?

BTW, JQuery & DataTables все initalised правильно, и я могу получить другие DataTable функциональности как постраничная работа :)

+1

Это сложный вопрос. Он должен работать. Я бы опубликовал сообщение на форуме DataTables. Аллан очень помог. – isherwood

ответ

0

Итак, мое решение было включить порядок по умолчанию на DataTables, а затем, чтобы предотвратить событие упорядоченности, имеющими аффект на элементах [что я не хочу событие своего рода работу над] в TH с возвращением ложным:

var table = $('.table-striped').DataTable({ 
"ordering": true 
}); 

$('.table-striped th div').click(function() { 
return false; 
}) 

<table class="table table-striped" cellspacing="0" width="100%"> 
    <thead> 
    <tr> 
     <th><span id="sort">Sort me</span><div>No sort</div></th> 
     <th>Col 2</th> 
     <th>Col 3</th> 
    </tr> 
    </thead> 

    <tbody> 
    <tr> 
     <td><span>2</span></td> 
     <td><span>CHARLIE</span></td> 
     <td><span>DELTA</span></td> 
    </tr> 
    <tr> 
     <td><span>1</span></td> 
     <td><span>ALPHA</span></td> 
     <td><span>BETA</span></td> 
    </tr> 
    </tbody> 

Надежда, что помогает!

Смежные вопросы