jquery - Unable to use vedmack/yadcf plugin with tigrang/cakephp-datatable -

i'm using tigrang/cakephp-datatable in 1 of cakephp 2.6 projects (and dt 1.10.6). far, have been able implement plugin plugin's author. plugin excellent , want' keep it.

now, i'm trying use vedmack/yadcf plugin along existing data table achieve (especially) column filtering functionality because find examples on official dt messy , limited. keep getting error when initialise yadcf:

typeerror: otable.settings not function var instance = otable.settings()[0].oinstance, 

is there way can both plugins work together? has tried this?

below js dt using cakephp-datatable:

$('.datatable').each(function() {     var table = $(this);     var model = table.attr('data-config');     var settings = datatablesettings[model];     settings['dom'] = 'lrtip';     settings['statesave'] = true;     settings['statesavecallback'] = function (settings, data) {                 $.ajax( {...});             };     settings['stateloadcallback'] = function (settings) {             ...             };     table.datatable(settings); }); 

i tried , few other tries after code above yadcf work got same error:

var table = $('.datatable'); yadcf.init(table, [             {column_number: 0, filter_type: "text", filter_reset_button_text: false, filter_delay:500},             ...,             {column_number: 4, filter_type: "select", filter_default_label: "select", filter_reset_button_text: false, filter_delay:500},             {column_number: 5, filter_type: "range_number", filter_reset_button_text: false, filter_delay:500},             ...,         ]); 

i have tried yadcf code without other plugin , works flawlessly. so, need on modifying code implement other plugin.

i tried this(because dt initialized using datatable() lowercase "d") didn't work:

$('.datatable').each(function() { ... ... table.datatable(settings)         .yadcf([                 {column_number: 0, ...},                 ...             ]); }); 

ps: had asked question on first plugin's github hoped author of yadcf or experienced can me out here.

try following (removed loop / this usage)

var table; var model = table.attr('data-config'); var settings = datatablesettings[model]; settings['dom'] = 'lrtip'; settings['statesave'] = true; settings['statesavecallback'] = function (settings, data) {             // send ajax request server state object             $.ajax( {                 "url": "/cake/users/save_state",                 "data": data,                 "datatype": "json",                 "type": "post",                 "success": function () {                     console.log("ca");                 },             });         }; settings['stateloadcallback'] = function (settings) {         var o;          // send ajax request server data. note         // synchronous request since data expected         // function             $.ajax( {                 "url": "/cake/users/get_state",                 "async": false,                 "datatype": "json",                 "success": function (json) {                 o = json;                 },             });         return o;         }; table = $('.datatable').datatable(settings);  yadcf.init(table, [     {column_number: 0, filter_type: "text", filter_reset_button_text: false, filter_delay:500},     {column_number: 1, filter_type: "text", filter_reset_button_text: false, filter_delay:500},     {column_number: 2, filter_type: "text", filter_reset_button_text: false, filter_delay:500},     {column_number: 3, filter_type: "text", filter_reset_button_text: false, filter_delay:500},     {column_number: 4, filter_type: "select", filter_default_label: "select", filter_reset_button_text: false, filter_delay:500},     {column_number: 5, filter_type: "range_number", filter_reset_button_text: false, filter_delay:500},     {column_number: 6, filter_type: "select", filter_default_label: "select", filter_reset_button_text: false, filter_delay:500}, ]); 

---

or can modify current code into

$('.datatable').datatable(settings); --> return $('.datatable').datatable(settings);

dtable('.datatable'); --> var otable = dtable('.datatable');