Why isn't customer select value validating at Shopify checkout?

Sergio999
New Member
4 0 0

I have  drop down select required  and i need a value to be selected par customer at check out 

 

this is my code

 

<p class="cart-attribute__field">
<strong style="color: red;">Veuillez spécifier la SAQ désignée pour la cueillette de votre commande</strong></label><br>
<select required class="required" id="note" name="attributes[note]">
<option value="">—-Sélectionner la SAQ désignée ici—-</option>
<option value="33507 - Saint-Augustin-de-Desmaures"{% if cart.attributes["note"] == "33507 - Saint-Augustin-de-Desmaures" %} selected{% endif %}>33507 - Saint-Augustin-de-Desmaures</option>
<option value="33596 - Vanier"{% if cart.attributes["note"] == "33596 - Vanier" %} selected{% endif %}>33596 - Vanier</option>
<option value="33585 - Carrefour Charlesbourg"{% if cart.attributes["note"] == "33585 - Carrefour Charlesbourg" %} selected{% endif %}>33585 - Carrefour Charlesbourg</option>
<option value="33584 - Les Saules"{% if cart.attributes["note"] == "33584 - Les Saules" %} selected{% endif %}>33584 - Les Saules</option>

</select>
</p>

 

When customer press check out button, it does not do the validation when no value

 

why ? what i need to add ?

 

tks

Replies 3 (3)

Developer-G
Shopify Partner
3032 593 846

Hello @Sergio999 ,

 

 

On cart page it will never work in this way. 

I suggest to write a custom JS function which will first check your select value. If it finds value then return true so default checkout functionality ill work else prevent checkout button to perform its action and shoe alert or custom message with select box.


Thanks

- If helpful then please Like and Accept Solution.
- Want to modify or custom changes or bug fix on store Hire me.
- Email: guleriathakur43@gmail.com - Skype: navrocks1 ,
- Try GEMPAGES a great page builder
-Advance Search Filter
Sergio999
New Member
4 0 0

hi 

i found this but does not work

 

<script>
jQuery(function() {
jQuery('body').on('click', '[name="checkout"], [name="goto_pp"], [name="goto_gc"]', function() {
var formIsValid = true;
var message = "Please fill this out and you will be able to check out.";
jQuery('[name="attributes"], [name="note"]').filter('.required, [required="required"]').each(function() {
jQuery(this).removeClass('error');
if (formIsValid && jQuery(this).val() == '') {
formIsValid = false;
message = jQuery(this).attr('data-error') || message;
jQuery(this).addClass('error');
}
});
if (formIsValid){
jQuery(this).submit();
}
else {
alert(message);
return false;
}
});
});
</script>

Sergio999
New Member
4 0 0

Hi

 i am not an expert in JS

somebody can help me on what would be the script to be able to validate if the field is empty and trigger error message

 

would really appreciate . And wont need  to manage customers  with empty field

 

tks