Как изменить данные в таблице данных, используя раскрывающийся список

Question

Я пытаюсь изменить данные, отображаемые в таблице данных, используя раскрывающийся список, в котором пользователь может выбрать состояние автомобилей, которые он хочет просмотреть. У меня проблема в том, что данные не меняютсякогда статус в выпадающем списке был изменен.Я использую django 1.8. Пожалуйста, смотрите мой код ниже.

Jquery / Таблица данных

var datatable = $("#datatable").dataTable({
"fnServerData": function (sSource, aoData, fnCallback) {
 $('#DropDown_Select').change(function () {
   status = $(this).val()
   $.ajax({
       "type": "GET",
       "dataType": 'json',
       "contentType": "application/json; charset=utf-8",
       "url": sSource + "/" + status, //sending server side status and filtering table
       "data": aoData,
       "success": function (data) {

           fnCallback(data);
       }
   });

 });  
 }).columnFilter({
aoColumns: [
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
    { type: "text" },
]

});

Таблица данных

<table id="datatable">
<thead>
    <th>Car</th>
    <th>Model</th>
    <th>Engine size</th>
    <th>Max speed</th>
    <th>Status</th>
</thead>
<tbody>
    <td>Example car</td>
    <td>Example make</td>
    <td>1.4</td>
    <td>110</td>
    <td>Status</td>
</tbody>
<tfoot>
    <th>Car</th>
    <th>Model</th>
    <th>Engine size</th>
    <th>Max speed</th>
    <th>Status</th>
</tfoot>

Раскрывающийся список

<select id="DropDown_Select">
<option value="new">New</option>
<option value="old">Old</option>
</select> 

Answer 1

DataTables имеет API, который вы можете использовать для фильтрации и манипулирования данными, которые показаны в таблице.Я выполнил некоторую выпадающую фильтрацию, и функция выглядела примерно так:

table.api().columns(<select column>).search(val ? '^' + val + '$' : '', true, false).draw();

.draw ();вызов важен, потому что каждый раз, когда вы вносите изменения в данные, которые вы хотите отобразить с помощью плагина, вы должны указать ему перерисовать.

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

table.api().columns(<select column>).column.data().unique().sort().each(function (d, j) {
    select.append("<option value='" + d + "'>" + d + "</option>");
});