Firefog Firefog - 4 months ago 21
HTML Question

How to add "required" in WooCommerce variation select option

I am trying to make woocommerce product variation field required I put the bellow script before

</head>
but is not working.

How Can I do this?

It works on Jsfiddle but not in my site what I am doing wrong.

My HTML:

<select id="color" class="" name="attribute_color" data-attribute_name="attribute_color">
<option value="" selected="selected">Choose an option</option>
<option value="White" class="attached enabled">White</option>
<option value="Black" class="attached enabled">Black</option>
</select>


My Script:

$(document).ready(function() {
$('select').prop("required", true);
});


Thanks.

Answer

On WordPress you need to use first jQuery, then adding $ to function($). This way you can use shorthand $ afterwards.

Here is your code:

jQuery(document).ready(function($) {
   $('select#color').prop("required", true);
});

(I have add the id color to select html tag in the jQuery selector. You can either remove it like in your code)

Comments