Добавить АЯКС данных на DataTable, прежде чем отправить

Question

Я инициализируется DataTable в переменном:

var dataTable = $("#selector").DataTable({ 
    processing: true, 
    serverSide: true, 
    ajax: $.fn.dataTable.pipeline({ 
     dataType: "json", 
     url: "/path/ajaxurl", 
     data: { 
      "fruits": "apple", 
      "veggies": "banana", 
     }, 
     dataSrc: "data" 
    }), 
    sPaginationType: "extStyle" 
}); 

Теперь, где-то в моем сценарии у меня есть этот флажок, что при изменении добавят новые данные о Аяксе выше, то инициализация draw():

$(document).on("change", "#add-some-liquors", function(e) { 
    // some validations here 

    // My attempt to add this data 
    dataTable.data({"drinks" : "coca-cola"}); 

    // Draw the dataTables 
    dataTable.clearPipeline().draw(); 
}); 

Кажется, что dataTable.data({"drinks" : "coca-cola"}); не добавляет напитков на POST, когда я проверил на внутреннем интерфейсе, я получаю только яблоко & банана, который является два по умолчанию инициализируется данные. Что мне не хватает?

Answer 1

Согласно the API.data метод предназначен только для извлечения. Попробуйте хранить данные в переменной, обновляя этот объект, а затем используя его в методе .ajax.

var items = {} 

ajax: $.fn.dataTable.pipeline({ 
    dataType: "json", 
    url: "/path/ajaxurl", 
    data: items, 

Answer 2

Заявить ваши данные как переменную и добавить стоимость напитков позже.

var data = { 
 
      "fruits": "apple", 
 
      "veggies": "banana", 
 
     }; 
 

 
console.log(data); 
 

 
//On the click event 
 
$('#chk').on('click', function() { 
 
    if ($(this).is(':checked')) { 
 
    data['drinks'] = 'coca-cola'; 
 
    } else { 
 
    //When unchecking the option, set it's value to null 
 
    data['drinks'] = null; 
 

 
    //Or delete the property. 
 
    //delete data['drinks']; 
 
    } 
 

 
    console.log(data); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="chk" />