Hey there folks,
I’m pretty new here and also pretty new to select2. So I’ve been trying to figure out how to tackle a requirement in my MVC core project (which has a from with lots of dropdowns and multiselects that are getting dynamically populated from a SQL database) and in this form , I have a multiselect dropdown ( let’s call it parent dropdown ) that has to control 3 other multiselect dropdowns (lets call them child dropdowns) which are hidden by default and show/hide them based on selected options from the parent dropdown so basically when the user choses one or more options from the parent dropdown , they should be shown to the user based on selected option and upon unselecting they should be hidden again.
So the issue is that lets say when the user chose option1 (which lets say is a number like 1) from the parent dropdown , the first child dropdown with the SPECIFIC data to that option (lets say 1.1 or 1.2 which starts with same number) should be visible and if they chose the second option (lets say 3) the second child dropdown shall be visible with SPECIFIC data to that second option (like 3.1 or 3.5 etc) and so on. So I can show the child ones based on $('#parent option:selected').count and hide them on the same logic but here is the problem, when the user choses lets say 1 3 6 from parent, I can properly show all 3 child dropdowns with data for 1-3-6, but if they remove lets say 1 (so from left) then the child ones won’t match the selected ones since they get removed based on number , is there any better way to handle this ?
I also have to show a text under each child dropdown that says for example "*Please chose a value for * The option that is chosen from the parent dropdown so like 1 or 3 or 6 but since I can’t figure out which option might be deleted by the user , the text will get screwed up by showing wrong info since I’m using option:selected:last to achieve new selected values which of course won’t work in this case since the user might remove the first option etc.
Any guidance would be appreciated 
Cheers
If you’re looking for a way to have select2 take care of all the functionality I’m not sure there is a way. My thought is that you’re going to have to write some javascript and tie it into the .on(‘change’ . . .
event of your first select.
Maybe someone smarter than me (which is just about everyone) can let you know of a better way, but my first thought was to use .on(‘change’.
Hey Phil,
Thanks for the reply … yeah I’m using the on.(‘change’) event both for hiding/showing child dropdowns and also for populating the data from my controller to be placed in the child dropdowns. Question would be how do I bind the dropdown to the value from parent so that If I remove the value from parent dropdown the correct child gets deleted.