SlimSelect组件问题：搜索后选择第二个选项失效

Hey there, sorry to hear you're running into this frustrating issue with SlimSelect! Based on your description (searching then selecting the second option triggers an error, but closing/re-searching fixes it) and your code snippet, here are some targeted fixes and debugging steps to try:

1. Test Disabling hideSelectedOption #

Your code enables hideSelectedOption: true, which hides already selected options from the dropdown. When combined with closeOnSelect: false (keeping the dropdown open after selection) and real-time search filtering, this might cause a DOM sync issue—after selecting the first option, it gets hidden immediately, and SlimSelect might try to reference elements that no longer exist in the filtered search list when you pick the second one.

Try turning this setting off temporarily to see if the error goes away:

hideSelectedOption: false, // Disable this for testing

If this resolves the problem, you could either skip using this built-in feature and implement custom logic to hide selected options, or check if a newer version of SlimSelect fixes this edge case.

2. Verify Your beforeOnChange Logic #

Your beforeOnChange handler clears the selection if the dropdown has data-singleselect="true":

beforeOnChange: function (info) {
  if ($(that).data('singleselect') === true) {
    dropDowns[that.id].set ([]);
  }
},

Double-check that the problematic dropdown doesn't have data-singleselect="true" set in its HTML markup. If it's a multi-select dropdown but this attribute is present accidentally, this logic will wipe the first selection when you try to pick the second one, leading to unexpected behavior.

3. Disable searchHighlight Temporarily #

The searchHighlight: true feature modifies option text to highlight search matches, which can sometimes introduce DOM manipulation conflicts when selecting options right after searching. Try disabling it to rule this out:

searchHighlight: false,

If the error stops occurring, this might be a bug with SlimSelect's built-in highlighting. You could either avoid using this feature or check the SlimSelect issue tracker for any existing reports or fixes.

4. Update SlimSelect to the Latest Version #

This might be a known bug that's already been addressed in a newer release. Upgrade to the most recent version of the plugin to see if the issue resolves itself.

5. Share the Exact Error Message #

Since you mentioned there's an error in your screenshot, sharing the specific error text (e.g., "TypeError: Cannot read property 'value' of undefined") would help pinpoint the exact issue. For example, if it's a DOM reference error, it would confirm that SlimSelect is trying to access an element that's been removed by the hideSelectedOption or search filtering logic.

内容的提问来源于stack exchange，提问作者Anton Klatt