Support

Home Forums Event Espresso Premium Required/Mandatory Fields look bad after a field validation occurrence.

Required/Mandatory Fields look bad after a field validation occurrence.

Posted: July 2, 2017 at 1:56 am

Viewing 8 reply threads


Peter

July 2, 2017 at 1:56 am

So basically when I’m going through my checkout, all is good if the registrant hits all the required tick-boxes, and gets exactly 10 characters in the phone number. I’ve been struggling because I’m not a developer but I’m on the Avada theme. I added some of the shortcode to my CSS to help make things a little easier, but I don’t think it’s CSS-related what’s happening here.

For this situation it seems like if the user gets some fields wrong and clicks “continue button” towards payment, the page will block them, but all the formatting for everything goes away, the red mandatory dots turn grey like all the other characters, and the error manifests itself as black text next to whatever checkbox was wrong.

The thing is, assuming you then correct the fields, it lets you through like nothing happened.

Can you help me figure out why the form sometimes blows up like this? I’ve just launched my form a couple days ago and as a replacement for the old one we like EE4 very much.

Kindly,
Peter


Josh

  • Support Staff

July 3, 2017 at 7:55 am

Hi Peter,

This sounds like a CSS issue. Can you post a link to an event page so we can investigate further?


Peter

July 3, 2017 at 1:32 pm

Sure thing, here is one of the classes: Event on our site


Josh

  • Support Staff

July 3, 2017 at 4:08 pm

Hi Peter,

There’s actually a JavaScript error thrown there so the client-side form validation isn’t loading. Here’s a screenshot of the console and the part of the page where the error was triggered:

https://www.evernote.com/l/AATlrNUZY4hKPYhgpY_hyvn6frxtMNUpgHcB/image.png

Can you try temporarily deactivating the W3 Total Cache minify scripts option? We’ll at least get a better idea of why that JavaScript error is being thrown this way.


Peter

July 3, 2017 at 4:59 pm

OK, I have disabled W3.

I do see MyFunction in there. I was using it to change the colours of the checkout table output on all pages by calling it from header.php.

I also see a different error that I don’t recognize in your evernote screenshot, the UncaughtTypeError.


Tony

  • Support Staff

July 4, 2017 at 3:49 am

I do see MyFunction in there. I was using it to change the colours of the checkout table output on all pages by calling it from header.php.

Have you removed it? myFunction can not be found so its throwing an error.

Can you not just use some CSS to change the table?

I also see a different error that I don’t recognize in your evernote screenshot, the UncaughtTypeError.

That’s from the minified scripts so we can’t see what is throwing that error.

It does not seem to be thrown currently so it may have been caused by the minifying as it often changes the load order which can cause problems.

Do you still have an issue with the checkout page?


Peter

July 4, 2017 at 12:38 pm

A friend came up with the MyFunction javascript because I don’t really know how to code and had mentioned I needed to solve the problem of outputting different numbers on the Spots Remaining column in red/orange/green depending on how many spots are left.

If I need to, I will start a separate thread asking about the best way to employ strictly CSS to effect the colour-changing spots-remaining fields.

I don’t think I need to do that just yet though because while I was testing removing W3 it appears to have corrected this error (I will open a new thread if it comes back later, my initial problem of hitting submit and upon a failed validation having the page lose all its formatting).

I would suspect there is some sort of incompatibility between the W3 caching plugin, and at least my deployment of EE4.

Can you recommend a good caching plugin to replace it with? Have you seen this type of thing before?


Josh

  • Support Staff

July 4, 2017 at 12:51 pm

The WP Super Cache plugin is recommended. W3 Total Cache can be used but it’s not an easy/simple plugin to configure correctly, because it has a lot of features and each feature must be set correctly to work with your server and activated plugins.

So for example with the minification issue you saw earlier, the scripts on the page need to load in a very specific order, and W3 total cache may have re-ordered the script load order, which would have caused the error you saw.


Peter

July 5, 2017 at 3:51 am

Thanks. I installed WP Super Cache and don’t notice any issues yet.

Viewing 8 reply threads

The support post ‘Required/Mandatory Fields look bad after a field validation occurrence.’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso