1

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 ); } } ); } ); 

1 Answer 1

2

You need to set dependent select in success function like below code snippet

editor.dependent( 'account_sectors2.sector_id', function ( val, data, callback ) { var test= new Array({"label" : "Any", "value" : "Any"}); $.ajax({ url: document.location.origin+'/Nexus/php/GetUnits.php', dataType: 'json', success: function (json) { console.log( 1, JSON.stringify( json ) ); for(var a=0;a < json.length;a++){ obj= { "label" : json[a][0], "value" : json[a][1]}; test.push(obj); } console.log( 2, JSON.stringify( json ) ); editor.field('your destination field').update(test); callback(test); } }); 

There is discussion available at here

Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.