Required not working in select field in prestige theme.

manuY
Visitor
2 0 0

hi,

i have use required attribute in my select filed even after this it's not validating the field, when i click on button without selecting any value in select field than button clicked and form got submitted. Required not working it's not showing any error if i don't have any value in the select field, and it's allow form to submit with blank value of select tag.

How i can put validation on select that if select does not have any value than it must show error and resist the form to submit without any value.

Reply 1 (1)

NikitaZanella
Visitor
2 0 0

Hello manuY,

I've worked as freelancer on the same theme.

The select element could be a bit tricky.

Try something like this:

<label for="size">Choose a size:</label>
<select name="size" required>
    <option value="">None</option>
    <option value="Small" {% if cart.attributes["size"] == "Small" %} selected {% endif %} >Small</option>
    <option value="Medium" {% if cart.attributes["size"] == "Medium" %} selected {% endif %} >Medium</option>
    <option value="Big" {% if cart.attributes["size"] == "Big" %} selected {% endif %} >Big</option>
</select>

Note: if your form in the cart-template.html has a "novalidate" attribute, be sure to remove it.

Also, check the w3schools reference here: https://www.w3schools.com/tags/att_select_required.asp

Let me know 🙂