The select2 component that we use to manage the autosuggest controls appends an HTML 'option' element each time an item is selected by the user, if one does not already exist.
Also, the select2 component displays user-facing selections by looping over the HTML option elements that it finds in the DOM.
So, to ensure that newly-added selections always appear at the end of the user-facing selection list, we need to maintain the same order for the option elements in the DOM. In particular, when a user unselects/clears an item, we need to remove the corresponding HTML option element.
Describe the reason for these changes and the problem that they solve
Allows the user to more easily re-order the ingredients within the autosuggest search controls.
Briefly summarize the changes
When an item is unselected from the list, remove the underlying HTML <option> element that the select2 library uses to store previously-selected items.
How have the changes been tested?
Local development testing.
List any issues that this change relates to
Fixes #239.
The
select2
component that we use to manage the autosuggest controls appends an HTML 'option' element each time an item is selected by the user, if one does not already exist.Also, the
select2
component displays user-facing selections by looping over the HTML option elements that it finds in the DOM.So, to ensure that newly-added selections always appear at the end of the user-facing selection list, we need to maintain the same order for the option elements in the DOM. In particular, when a user unselects/clears an item, we need to remove the corresponding HTML option element.
Describe the reason for these changes and the problem that they solve
Allows the user to more easily re-order the ingredients within the autosuggest search controls.
Briefly summarize the changes
<option>
element that theselect2
library uses to store previously-selected items.How have the changes been tested?
List any issues that this change relates to Fixes #239.