Purpose of data-display?

[mrdarrengriffin]

Looking at the example on https://bluzky.github.io/nice-select2/, the data-display functionality does not work.

From my understanding, it allows the user to provide alternative text to use when the option is selected. If this is the case, the example should show "Select" when the "Nothing" option is chosen. Not sure if I am misunderstanding this feature, but some clarification would be helpful

Thanks

[Tsjippy]

I see thats broken, fixed now

[LuigiPulcini]

The fix to this issue (1 March 2023) was never released since the latest release 2.1.0 is from 23 January 2023. As a result, the latest package available for npm is 2.1.0 and doesn't contain this fix.

[Tsjippy]

Sorry for the delay, I published it

[1ucay]

with woocommerce we can now use flags in country selector, if we have phone picker js/css on page => https://github.com/jackocnr/intl-tel-input

add_filter( 'woocommerce_form_field', 'country_woocommerce_form_field', 10, 4 );
function country_woocommerce_form_field( $field, $key, $args, $value ) {

    switch ( $args['type'] ) {
        case 'country':

            $field = preg_replace('/(<select name="(.*?)country"(.*?)>)(.*?)<\/select>/', '$1', $field );

            $countries = 'shipping_country' === $key ? WC()->countries->get_shipping_countries() : WC()->countries->get_allowed_countries();

            foreach ( $countries as $ckey => $cvalue ) {
                $field .= '<option data-display="<div class=\'iti__flag-box\'><div class=\'iti__flag iti__' . mb_strtolower( esc_attr( $ckey ) ) .'\'></div></div>' . esc_html( $cvalue ) . '" value="' . esc_attr( $ckey ) . '" ' . selected( $value, $ckey, false ) . '>' . esc_html( $cvalue ) . '</option>';
            }

            $field .= '</select>';

            break;
    }

    return $field;
}