Checkout fields dropdown force using 'select2' instead 'chosen'

  • Postalindo

    (@postalin)


    10 years, 1 month ago

    I am using the woocommerce filter “woocommerce_checkout_fields” to add a custom select field to my checkout billing page. However it is styled as a ‘chosen’ select field instead of ‘select2’.

    This is not very nice since on the same page the State field is using a ‘select2’ styled field so the page shows two different types of controls and doesn’t look good.

    Is there a way to force woocommerce to force use the select2 style for my custom field?

    Thanks for any advice

    Website: http://postalindo.com/cart/checkout/
    Plugin: https://ww.wp.xz.cn/plugins/woocommerce/

Viewing 1 replies (of 1 total)
  • Adriano Monecchi

    (@designroom)

    9 years, 11 months ago

    You’d need a helper function to allow you to add a class or other atributes to your fields on checkout page. I’ve created a function that allows you to manage any woocommerce checkout field or custom field classes, please check it out here: http://stackoverflow.com/questions/23943791/add-custom-css-class-to-woocommerce-checkout-fields/36724593#36724593

    After getting your fields with the right classes, then you’d need a small piece of js to trigger the select2 plugin

    E.g: 

    jQuery(document).ready(function($) {
// If the select2 class exists, then fire the select 2 function
if (jQuery(".select2").length > 0)
   $("select.select2").select2({ // if using css class
 	width: "100%",
 	//minimumResultsForSearch: Infinity,  // hide select 2 search field
    allowClear: true
   });
});
Viewing 1 replies (of 1 total)

The topic ‘Checkout fields dropdown force using 'select2' instead 'chosen'’ is closed to new replies.