DataTables с добавлением выбора формы

Question

вот мой код:

Javascript:

$(document).ready(function() { 
    $('#example').DataTable({ 
     "ajax": '../ajax/data/arrays.txt' 
    }); 
}); 

HTML

<select id="office-select" name="idOffice"> 
    <option value="">All</option> 
    <option value="1">Berlin</option> 
    <option value="2">New York</option> 
    <option value="3">Tokio</option> 
</select> 
<table id="example" class="display" width="100%" cellspacing="0"> 
     <thead> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Extn.</th> 
       <th>Start date</th> 
       <th>Salary</th> 
      </tr> 
     </thead> 
     <tfoot> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Extn.</th> 
       <th>Start date</th> 
       <th>Salary</th> 
      </tr> 
     </tfoot> 
    </table> 

После того как я выбрать офис (например, Нью-Йорк) от выбора формы, я хочу для динамической перезагрузки содержимого таблицы из файла '../ajax/data/arrays.txt?idOffice=2'

Как можно Я делаю это? Большое спасибо :)

Answer 1

Используйте код ниже:

$('#office-select').on('change', function(){ 
    $('#example').DataTable().column(2).search($(this).val()).draw(); 
}); 

См this example для кода и демонстрации.