jquery-ui
jquery-ui copied to clipboard
Hidden select and visible ui-select have different values
When I hide options in my select by setting the hidden attribute and also preselect an option, then I get an error when opening the selectmenu.
Here is the code the jquery executes until the error occures:
... this.button.one( "focusin"); -> that._refreshMenu(); -> this._getSelectedItem().data( "ui-selectmenu-item" ); -> this.menuItems.eq( this.element[ 0 ].selectedIndex ).parent( "li" );
This happens because the options' DOM-element attribute selectedIndex does not match the index from the rendered ui-select-menu. When I start selecting other entries now, the native select has a different value than what is displayed in the ui-selectmenu-button.
I also created a fiddle, in which the selectmenu won't open at all.
https://jsfiddle.net/isaraystanz/750p69qu/19/
On my local system the selectmenu will show and I can select entries, but the select's value gets messed up so I can't use it safely.
Thanks for the report. This looks like a 1.13 regression as it works fine with 1.12.1: https://jsfiddle.net/m_gol/vtf2bwpr/ (EDIT: incorrect test case, look at my next comment) A modified 1.13.1 test case (as yours used the 1.13.1 JS but 1.13.0 CSS) is, indeed, broken: https://jsfiddle.net/m_gol/zmnx3ucs/
It looks like I messed the 1.12.1 version of the test case above. So, let me share new ones with the latest version of jQuery jQuery UI for each line:
- (working) with jQuery 3.6.3 & jQuery UI 1.12.1: https://jsfiddle.net/m_gol/h4vrs6wn/
- (broken) with jQuery 3.6.3 & jQuery UI 1.13.2: https://jsfiddle.net/m_gol/cfkxa1pL/
The first bad commit is a2b25ef6caae3e1a272214839b815a6387618124. There's even a comment from 4 years ago suggesting a similar issue: https://github.com/jquery/jquery-ui/commit/a2b25ef6caae3e1a272214839b815a6387618124#commitcomment-26579991
PR with a fix: #2144