I have two select fields in my DataTable Editor instance and a working dependent() which looks like this:
editor.dependent( 'account_sectors2.sector_id', function ( val ) { return ( val == null ) ? { hide: ['account_sectors3.sector_id'] } : { show: ['account_sectors3.sector_id'] }; } ); As of right now, each time if I select a value of the first select e.g. (11, 23, 31-33, ...) I get ALL the select option values of the second. But what I would like to have is, to show only certain values of the second select values depending on the first selected value, e.g. like this
Values:
11 |_111 |_112 |_113 |_114 23 |_236 31-33 |_311 |_312 |_315 |_325 |_332 |_334 |_335 How can this be done?
datatable.php
Field::inst( 'account_sectors2.sector_id' ) ->options( 'sectors2', 'NaicsCode2', 'NaicsTitle2' ), Field::inst( 'sectors2.NaicsTitle2' ), Field::inst( 'account_sectors3.sector_id' ) ->options( 'sectors3', 'NaicsCode3', 'NaicsTitle3' } ), Field::inst( 'sectors3.NaicsTitle3' ) The returned json looks like:
{ "data":[ ... ], "options":{ "account_sectors2.sector_id":[ { "label":"Agriculture, Forestry, Fishing and Hunting", "value":"11" }, { "label":"Construction", "value":"23" }, { "label":"Manufacturing", "value":"31-33" }, { "label":"Mining, Quarrying, and Oil and Gas Extraction", "value":"21" }, { "label":"Utilities", "value":"22" } ], "account_sectors3.sector_id":[ { "label":"Animal Production and Aquaculture", "value":"112" }, { "label":"Apparel Manufacturing", "value":"315" }, { "label":"Beverage and Tobacco Product Manufacturing", "value":"312" }, { "label":"Chemical Manufacturing", "value":"325" }, { "label":"Computer and Electronic Product Manufacturing", "value":"334" }, { "label":"Construction of Buildings", "value":"236" }, { "label":"Crop Production", "value":"111" }, { "label":"Electrical Equipment, Appliance, and Component Manufacturing", "value":"335" }, { "label":"Fabricated Metal Product Manufacturing", "value":"332" }, { "label":"Fishing, Hunting and Trapping", "value":"114" }, { "label":"Food Manufacturing", "value":"311" }, { "label":"Forestry and Logging", "value":"113" } ] }, "files":[ ], "draw":1, "recordsTotal":"20", "recordsFiltered":"20" } Within the dependent() function it is also possible to do a callback. I guess that's the way to go ... but I'm struggling to implement it.
editor.dependent( 'account_sectors2.sector_id', function ( val, data, callback ) { $.ajax( { url: 'datatable.php', dataType: 'json', success: function ( json ) { callback( json ); } } ); } );