SF Pro Removing Classes from custom select elements

Anonymous

#209966

I thought I might need to add the actual markup that’s being output:

<select name="_sfm_recognition_document_type[]" class="sf-input-select wide" title="" style="display: none;">
  <option class="sf-level-0 sf-item-0 sf-option-active" selected="selected" data-sf-depth="0" value="">Type: All Checks</option>
  <option class="sf-level-0 " data-sf-count="4" data-sf-depth="0" value="BusinessCheck">Type: Business Check</option>
  <option class="sf-level-0 " data-sf-count="1" data-sf-depth="0" value="PAD">Type: Pre-Authorized Debit</option>
  <option class="sf-level-0 " data-sf-count="2" data-sf-depth="0" value="PersonalCheck">Type: Personal Check</option>
</select>
<div class="nice-select sf-input-select wide" tabindex="0">
  <span class="current">Type: All Checks</span>
  <ul class="list">
    <li data-value="" class="option selected">Type: All Checks</li>
    <li data-value="BusinessCheck" class="option">Type: Business Check</li><li data-value="PAD" class="option">Type: Pre-Authorized Debit</li>
    <li data-value="PersonalCheck" class="option">Type: Personal Check</li>
  </ul>
</div>

Anonymous

#209968

https://cl.ly/70444f1c38cc

Trevor

#209989

If ajax is being used on the form, that will remove any classes added. The AutoCount feature does this, and I am not sure, but the general Ajax feature might also. So, test which (or both) it is. You need some custom JavaScript to reapply the classes.

This post shows the script(s) needed:

https://support.searchandfilter.com/forums/topic/re-initialize-plugin-js-swup/#post-203208

Anonymous

#209995

So even when I disable ajax, auto count, and auto submit, it still doesn’t work as expected.
I tried adding the initialization of nice-select into the ajax complete as you mentioned also, and that didn’t work either.

(function ( $ ) {
    "use strict";
    $(document).on("sf:ajaxfinish", ".searchandfilter", function(){
        $('#search-filter-form-19977 select').niceSelect();
    });
}(jQuery));

Anonymous

#209997

This reply has been marked as private.

Trevor

#209999

mmm

The alternaitve is to use Select2, which we include with the plugin, is maintained by Automattic (via WooCommerce) and is quite good?

These two threads discuss this (many of the posts won’t be relevant to you):

https://support.searchandfilter.com/forums/topic/design/

and

https://support.searchandfilter.com/forums/topic/customise-dropdown-combobox/

Anonymous

#210001

Ok, I guess we’ll just use Select2 and try to style it similarly.

[Author]

Posts