On Sep 3, 3:32 am, burlistic <burlis...@yahoo.co.uk> wrote:
> Hi All,
>
> Not sure this is the best place for this question, but I hope someone
> can help.
>
> I have a form which requires a lot of client side validation. As this
> takes a while I am using an overlay to stop access to the form.
That is probably pointless.
> The
> problem is, the overlay only appears after all valition code has
> exectured. Thus rendering it useless.
>
> Standard stuff really... Large div with a class that has display:
> none;
>
> Form submit (onsubmit="validate(); return false;") calls the
The usual way would be to use something like:
<form onsubmit="return validate(this);" ... >
> validation code, which also submits the form if there are no errors.
> See code below;
>
> function validate()
> {
>
> $('#messageOverlay span').text('Validating');
> var messageOverlay = $('#messageOverlay');
> $(messageOverlay).removeClass('hide');
>
> //VALIDATION CODE GOES HERE
>
> }
>
> Strangly the overlay appears if I place an alert in the validation
> code??
Browsers usually don't update the document while scripts are running,
they do it all at the end, which makes a lot of sense as they have no
idea what the script will do to it. An alert provides a pause so the
document is updated.
> I would really expect the overlay code to run first and dispaly the
> message. Why does it only happen after all the code has executed?
See above.
> I've tried so many things.. Like attaching the overlay code to the
> button click and using bind() to attached the method calls seperatly.
> Any help greatly appreciated.. If you sovle my problem and live / work
> in London I will by you many beers!
I don't live anywhere near London. You will have to do something like:
cancel form submission, set the "overlay", call validation using a
short setTimeout, at the end of validation submit the form (or not)
and remove the overlay.
But you run the risk that if the overlay doesn't block access so the
user can submit the form while validation is running or start a second
process and submit it multiple times... you are adopting a brittle
strategy. Just validate the form and return false if it fails. The
script wil block the UI anyway.
You have to validate on the server anyway, the only reason to validate
on the client is to make life easier for users. Your approach may well
make it more difficult.
--
Rob.
