Woocommerce not completing - missing* in required field

Hi,

I wonder if you can help me?

In the Woocommerce Checkout I have the default setup where County / State is a required field, however, it is missing the * in the label that denotes this. Consequently, when a visitor trys to pay for physical item but have not entered Count / State they can’t complete the process. There is the warning that this has not been filled in, but it has caused confusion for a number of customers. There is no problem with the Downloadable items as they bypass the shipping requirement.

The page with the items for sale is here: https://hymnsocietygbi.org.uk/publications/occasional-papers/

Hi there,

I checked your website and followed the checkout process and found out that the asterisk is showing correctly on the Country input field:

I used the Physical Copy to make sure using the correct product. I checked the case using the Google Chrome browser.

Do I miss something here?

Hi Christopher,

Thanks for taking a look. Yes, the Country field has the asterisk but it is the County / State field that is missing the asterisk. Please see the screenshot (I should have supplied one in the first place - sorry)

Thanks.

Ken

Hi there,

Sorry for misunderstanding the question. Unfortunately, couldn’t find why that is happening but a workaround is to add the code below to Pro > Launch > Theme Options > JS:

jQuery('label[for="billing_state"]').append('&nbsp;<abbr class="required" title="required">*</abbr>');

Thank you.

Hi Christopher,

Thanks for the code, unfortunately, it didn’t work out.

However, I have found a partial workaround - I added a new Billing Field called billing_state_2 with the label “County / State”, made it a text field and added the State validation. Then I disabled the original billing_state field, making the new field mandatory and enabled.

This worked with all countries selected. :grinning:

However, when I looked into the Shipping Fields I discovered the same problem with the State / County input - the asterisk was there if I chose US or any other Country except UK.

I tried the workaround mentioned above (adding a new shipping_state_2), but the new field does not replace the old. I changed the label of the shipping_state_2 field to “County / State” but the field on the form remained “State / County” when UK was the shipping to Country was selected even though I had disabled the original shipping_state field.

Could this be a problem with the Woocommerce plugin itself?

Best wishes,

Ken

Hey Ken,

I switched to the default theme and deactivated Woo Checkout Editor in my test site and choosing UK does not have a required (asterisk) sign. This tells us this is on WooCommerce side. Not sure if this is a bug or intentional though.

Thanks.

Thanks very much for looking at this.

I think it must be a bug on the Woocommerce side then as State and County occupy the same field in the form and it is required. If we try to checkout without filling in the County field of a UK address, the form shows this as an error and does not complete the checkout process unless the field is completed, whereas the State label has the asterisk if US or any other country is selected. Without the asterisk on the label, it’s easy to confuse the Country with County as has happened to a couple of my customers.

Who should report this to Woo?

Hi there,

Actually, the Woo Checkout Editor plugin is coded by us and if there is a problem we need to follow up and fix.

But as my colleague stated even with that plugin disabled the Country/State option is still required and does not have the asterisk. We will be in contact with Woocommerce which will take a long time to resolve, but is it possible to have your Wordpress Dashboard URL/User/Pass to follow up the case and try to at least resolve the case for your instance?

Kindly give us the information using the Secure Note functionality of the post.

Thank you.

Here you go…

Hi There,

Unfortutunately, I can’t access your login URL. When I tried the usual /wp-admin or wp-login.php I am redirected to http://127.0.0.1/. Did you change login URL?

Sorry, I have renamed the login page.

Here it is:

Hi There,

Unfortunately, I can’t access it.

If you have IP blocking please disable it at the moment.

Hi, It should be accessible now

If you send me your IP address I’ll whitelist it.

Hello,

Thank you for writing in!

When I access this page: https://hymnsocietygbi.org.uk/?Grav1ta5=1 - I am being redirected to the Home page and I`ve tried to use the credentials here: https://hymnsocietygbi.org.uk/wp-login.php - but they are wrong.

Try this now

Hi there,

Thank you for providing the login information. I managed to access Pro > Launch > Theme Options > JS and added the code I have suggested before and now the county/state label has the asterisk:

Thank you.

Hi Christopher,

Thank you for your help, much appreciated. However, unfortunately, it was the new ‘County / State’ field I added the other day that you saw in the Checkout, not the default ‘State / County’ field that is added by default that had the asterisk. I also checked the Shipping ‘State / County’ field for the UK and the ‘County’ field on the Checkout remains without the asterisk.

I’ve reverted to the default ‘State / County’ field in the Checkout to prevent any confusion.

Kind regards,

Ken

Hi there,

As Christian said, this looks like related to Woocommerce itself. I deactivated the checkout edit plugin and switched to another theme and it’s still the same.

As for workaround, I changed your javascript to this

jQuery( document ).ready( function($) {

setTimeout( function() {

jQuery('label[for="billing_state"]').append('&nbsp;<abbr class="required" title="required">*</abbr>');
jQuery('label[for="shipping_state"]').append('&nbsp;<abbr class="required" title="required">*</abbr>');

}, 1000 );

} );

Thanks!

Thanks, iam, much appreciated. :smile:

Ken