I am currently working on a similar component, and ran into the same issue. The key problem is that the values in the selected column must be a subset of the picklist shown in the available column."A list of default options that are included in the selected options listbox. This list is populated with values from the options attribute."
How I am going about solving this is:
In the duallistbox onchange event capture the current values in the selected array and compare them to the ones incoming from the event and keep a master list shown next to the selected column.
Some array comparison logic was made to handle cases where the event values are coming from a new dependent list and also in general which values to add or remove from the master list.
Then when the combobox onchange event is handled, set the value of the selected column to your master list IF it is a part of the picklist shown.
If the selected array is just set to the full master list only the values that are a subset of the available column will be shown, but it made the array comparison logic more difficult for me.
Your other option is to find the component source code on Github and fiddle with it to act as you want.
Best of luck, let me know if you find something easier!
{}
button in your editor to format code properly), and anything else you think might be useful. You're limited to 30,000 characters, so that should be plenty, but do try to keep the code snippets relevant to the work you're doing. As soon as you're done, we'll be happy to take a look at it with you. Also, please feel free to @ -mention me, I try to respond to all requests.