Support » Plugin: WooCommerce » Coupons: Input=Text not available & "chzn" vs "chosen"?

  • Resolved popgirl23

    (@popgirl23)


    Been trying to fix this issue for a week.

    I am unable to use the Coupon function. Four of the fields under Woocommerce > Coupon > Usage Restrictions are not available to me: Products, Exclude Products, Product Categories, and Exclude Categories. Only these fields are not working.

    In Chrome Developer I see two clues when switching between my theme and the twentyfourteen default theme. In my theme those INPUT tags show an inline style of width:0px, while using a default theme they show width:40px; . Second clue is in my theme there are class names using “chzn” etc, while in the default I see “chosen”. With both themes pointing to different stylesheets as a result. (see below). I also disabled the 3 included woo stylesheets to see if that helped and it did not. Ive cleared all custom styles, and disabled all plugins except Woo. Frustrating.

    My theme:

    <div class="options_group">				<p class="form-field"><label for="product_ids">Products</label>
    				<select id="product_ids" name="product_ids[]" class="ajax_chosen_select_products_and_variations chzn-done" multiple="multiple" data-placeholder="Search for a product…" style="display: none;">
    									</select><div id="product_ids_chzn" class="chzn-container chzn-container-multi" style="width: 0px;"><ul class="chzn-choices"><li class="search-field"><input type="text" value="Search for a product…" class="default" autocomplete="off" style="width: 0px;"></li></ul><div class="chzn-drop" style="left: -9000px; width: 0px; top: 0px;"><ul class="chzn-results"></ul></div></div> <img class="help_tip" src="http://holondesign.com/inProgress/NTL_dev/wp-content/plugins/woocommerce/assets/images/help.png" height="16" width="16"></p>
    								<p class="form-field"><label for="exclude_product_ids">Exclude products</label>
    				<select id="exclude_product_ids" name="exclude_product_ids[]" class="ajax_chosen_select_products_and_variations chzn-done" multiple="multiple" data-placeholder="Search for a product…" style="display: none;">
    									</select><div id="exclude_product_ids_chzn" class="chzn-container chzn-container-multi" style="width: 0px;"><ul class="chzn-choices"><li class="search-field"><input type="text" value="Search for a product…" class="default" autocomplete="off" style="width: 0px;"></li></ul><div class="chzn-drop" style="left: -9000px; width: 0px; top: 0px;"><ul class="chzn-results"></ul></div></div> <img class="help_tip" src="http://holondesign.com/inProgress/NTL_dev/wp-content/plugins/woocommerce/assets/images/help.png" height="16" width="16"></p>
    				</div>

    Twentyfourteen theme:

    <div class="options_group">				<p class="form-field"><label for="product_ids">Products</label>
    				<select id="product_ids" name="product_ids[]" class="ajax_chosen_select_products_and_variations" multiple="multiple" data-placeholder="Search for a product…" style="display: none;">
    									</select><div class="chosen-container chosen-container-multi" style="width: 0px;" title="" id="product_ids_chosen"><ul class="chosen-choices"><li class="search-field"><input type="text" value="Search for a product…" class="default" autocomplete="off" style="width: 40px;"></li></ul><div class="chosen-drop"><ul class="chosen-results"></ul></div></div> <img class="help_tip" src="http://holondesign.com/inProgress/NTL_dev/wp-content/plugins/woocommerce/assets/images/help.png" height="16" width="16"></p>
    								<p class="form-field"><label for="exclude_product_ids">Exclude products</label>
    				<select id="exclude_product_ids" name="exclude_product_ids[]" class="ajax_chosen_select_products_and_variations" multiple="multiple" data-placeholder="Search for a product…" style="display: none;">
    									</select><div class="chosen-container chosen-container-multi" style="width: 0px;" title="" id="exclude_product_ids_chosen"><ul class="chosen-choices"><li class="search-field"><input type="text" value="Search for a product…" class="default" autocomplete="off" style="width: 40px;"></li></ul><div class="chosen-drop"><ul class="chosen-results"></ul></div></div> <img class="help_tip" src="http://holondesign.com/inProgress/NTL_dev/wp-content/plugins/woocommerce/assets/images/help.png" height="16" width="16"></p>
    				</div>

    Please help. The site is close to launch and this is dragging things.

    https://wordpress.org/plugins/woocommerce/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Let me add, simply trying to override the inline style does nothing as well.

    The theme developer provided me with updated files for jQuery Chosen which he had bundled with the theme. This fixed the issue.

    I am having this exact same issue. Can you describe the solution a little more or point me towards the jQuery file that I could download?

    Thanks!

    Im not a js developer so my description is rudimentary at best here. Also where these files go in your theme may not be the same location in my theme.

    I replaced two files. I got them straight from the theme developer so I don’t know where to grab them off the web. Im sure a Google search will find them. Look for the latest version. Probably a GitHub link will do.
    chosen.css
    chosen.jquery.js

    In my particular theme they were replaced inside:
    mythemename/framework/admin/css
    mythemename/framework/admin/js

    But that’s probably different in yours. You’ll have to do a search for the files to replace.

    Basically there’s a jquery plugin called “Chosen” that replaces bulky & ugly dropdown menu’s with a search field type replacement. Theme developers began adding it to some of the more popular and advanced themes. But its either not 100% compatible with the latest version of WP or its still a bit buggy.

    Hope that helps!

    one more thing. You will need to add the following to your stylesheet as the fix causes a few of the theme shortcode boxes to appear incorrect:

    .chosen-container {
    width: 200px!important; }

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Coupons: Input=Text not available & "chzn" vs "chosen"?’ is closed to new replies.