Required field not working

Highlighted
New Member
10 0 0

Hi, looking for some help

 

I have recently added a custom field for all my products to allow customers to enter their phone model when buying a phone case. The field works however I want this to be a required field in order for them to add it to their cart. 

I have entered the following code (from Shopify UI Elements Generator) which I was under the impression would make entering text in that field mandatory, however it doesn't and still lets you add the product to your basket.

<p class="line-item-property__field">
<label for="your-phone-model">Your Phone Model</label>
<input required class="required"id="your-phone-model" type="text" name="properties[Your Phone Model]">
</p>

My site is www.propericonic.co.uk or proper-iconic.myshopify.com 

Can anyone help?

Thanks

Matty

0 Likes
Highlighted
Shopify Partner
1012 209 253

Hello Matty,

Sorry can't provide code for this  but can explain why it's not working.
Actually you have ajax enabled on 'add to cart button' but that ajax call doesn't check either there is value in field or not. To make it as you want there is 2 ways.
1) Disable ajax if there is an option in your theme to do this.
2) Check your ajax call and before perform the add to cart action return validation error so user can't proceed with blank input.

Another issue in your store is when 'add to cart' button clicked header cart counter not updated  but once you reload the page cart counter display there.

Thanks

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
Highlighted
New Member
10 0 0

Thank you for your response. 

 

I am using 'Simple' theme but can't see anywhere to disable Ajax. 

Can you explain point 2 a bit further to see if I can make this work? I'm no code expert so that isn't very clear to me.

 

Also any idea why the cart counter isn't working?

 

Cheers

0 Likes
Highlighted
Shopify Partner
1012 209 253

Explanation for point 2, when ajax code run write your own code to check the value of input you added. And if input is blank show error message and if there is value leave it as it is working.
You can find code in theme.js

For cart counter, After 'add to cart' check console. You will find this error highlights there 'Uncaught TypeError: Cannot read property '$cartCount' of undefined' When this error fixed cart counter will start working as it was. 

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
Highlighted
New Member
10 0 0

Thank you

 

However I now have another problem, all my images have gone very low opacity! I don't know how this has happened. Can you help?

 

You can see here www.propericonic.co.uk 

0 Likes
Highlighted
New Member
10 0 0

The navigation links aren't working either, please help! 

 

0 Likes