Hi,
I would love to get required fields highlighted when pressing the submit button.
Meaning: when a required field is not filled upon hitting the submit button, every missing field should have some sort of highlighting.
Is there anyone who has done something similar in the past?
Thank you for your support!
Chris
Hi Bob,
this is really giving me a headache.
I don't know where to put the new Show_Html Action. If I just replace the existing Show_HTML action, and add a class to the form, the form indeed gets the class "error".
What I want to do though, is, give every element, which is required and not filled yet, the new class "error".
Could you please give me a hint on how to use your Custom Action to achieve that?
Thanks a lot,
Chris
Hi Chris,
You need to replace the standard Show HTML action with the [GH] version and then add the extra FormCheck option on the FormCheck tab. I think it will be: fieldErrorClass: 'error',It's possible that you may not need the final comma . . .
Bob
Hi Bob,
after adding the FormCheck option you have mentioned, no validations are made anymore. Even though all fields are set to required, the form submits with empty fields. When using the HTML action with the [GH] without the FormCheck option, the standard blue field appears which states, that the field is an required field. (so no difference to the standard Show HTML action.
I guess I miss something of the basic concept of chronoform. 🤨
Chris
Hi Chris,
Sorry I added a ; instead of a : - I've corrected my earlier post. Please try that, if it doesn't work I'll take a more detailed look tomorrow (it's dinner time here).
Bob
Hi Bob,
this indeed solved the problem that no validation at all took place.
The custom class "error" is still not added to the not filled required fields.
I will PM you some credentials to the "work in progress" site in case you want to take a look at the actual site.
Have a good evening and "see" you tomorrow.
-By the way, we will of course buy a licence for your great form before the site goes online.-
Chris
Hi Chris,
Hmm . . . everything is working OK except for the code that adds the class. That is the options are being added to the Form Checker OK and I've added some CSS that turns the input red if the class is added.
I've taken a backup copy of your form and will test on my local server where i have an uncompressed version of the FormCheck code that make it possible to see what is happening.
Bob
Hi Chris,
I eventually untangled this and got it working. There are a few things needed:
[list]
Please upgrade to the latest version of the Show HTML [GH] action - I changed one line this morning (I'll PM you a copy shortly).
In the Show HTML [GH] action add this to the box on the FormCheck tab:fieldErrorClass: 'validate_error',
display: {
showErrors: 1,
addClassErrorToField: 1,
indicateErrors: 2
},You may not need all these options: showErrors: 1 shows the errors on tabbing; indicateErrors: 2 lets you see more than one error at a time.
Add this to the Load CSS action:input.validate_error, select.validate_error {
border-left: 6px solid red;
}
input[type="checkbox"].validate_error + label, input[type="radio"].validate_error + label {
border-right: 6px solid red;
}This shows errors with a red bar to the left of the inputs. You can change the CSS to suit your need but I tested with this version.[/list]
That should work OK.
Bob
Hi Bob, thanks again for your fast support. Everything works like a charm now.
Don't get drunk on the beer I just sent you :-)
Cheers,
Chris
Hi Bob,
just to let you know for future developments of your component:
I have encountered a very strange behaviour when switching between simple and advanced wizard mode.
Sometimes, when switching to advanded mode to edit an action after using the simple mode to edit an email layout, all the changes done to the actions are resetted! Instead of my custom actions, the standard actions, that were there when creating the form at first, appear.
This isn't to hard with my rather simple form, but can be a real bummer for more advanced forms.
Just let me know if you need any more infos on that. Feel free to login to my site, if you want to experience it for yourself. Please backup the form though :-)
Chris
Okay, understood. You should really add the warning in future releases since the behaviour is not that obvious.
Thaks for your support so far.
I will mark that thread as SOLVED.
Chris
Hi Chris,
I agree - I don't have any control over the released code but I have added this to the current bugs list in the forum here to remind Max for the next release.
Bob
Hi Bob,
I have one other question concerning the form validation.
When submitting the form within Internet Explorer 8, no validations are made. The JS doesn't seem to be compatible with this older, but not totally outdated, version of IE.
Are you aware of this behaviour? Do you haven an idea on how to solve this issue?
Greetings from Berlin,
Chris
Oh sorry. I just reactivated your account. Please use same credentials as in my PM from last week if you wish to have a look.
Chris
Hi Chris.
It looks OK here. I checked both IE9 in IE8 browser mode and IE8 running on XP in a Virtual PC and the validation appears OK in both versions.
Bob
Thanks for checking, Bob.
Seems to be an issue with the settings on my PC at work. I am working for a big corporation and it might be that they have some security settings that prevent the validation to work :-?
Never mind then.
If you have checked it within a "normale" configuration and it works, everything is fine.
Thank you!
