Ajax and Forms

[charlesh]

Thanks for the compliment, John-Marc!

CSS is a bear, but I remember tables and how if you had one </tr> missing or out of place, the whole thing would come crashing down and troubleshooting it was very painful! Lemme guess, the site you just redid was tables and you're converting them to CSS?

Firebug is cool for CSS, for sure. Also, the inspect tab lets you see what your divs are doing, including padding, etc.

...Almost finished with the mods. I've actually decided to try an array for error elements. The problem i'm having with using one 'anyerror' var is that when an element is correct, it changes the anyerror back to true. So, what I've decided to do is either create separate vars for each evaluation, then run a check on form submit to make sure nothing returns from the variables, or put all of them in an "anyerror" array...

All this and when I'm finished with the Javascript, beef up the php validation in case of <noscript>. Damn. I should have charged more!

[charlesh]

This works, but a bit hackish.... I first set all the vars to true and then they get changed to false as the user fills out the form. I tried the array thing, but couldn't get it to work out.

function checkForm(form){
        if (usernameerror || pworderror || emailerror || firstnameerror || lastnameerror){
          document.getElementById('form_help').innerHTML = '<img src="images/info.jpg" alt="" width="25" height="24" />&nbsp;&nbsp;Please correct any errors and re-submit.';
        return false;
         } else {
          return true;
         }
}

[jmarcv]

Lemme guess, the site you just redid was tables and you're converting them to CSS?

LOL! That and AJAXIFY it.

Damn. I should have charged more!

Well, we cant always expect our clients to pay for our education. You'll have good tools after this one.

This works, but a bit hackish....

Yeah.... not a good idea....

The problem i'm having with using one 'anyerror' var is that when an element is correct, it changes the anyerror back to true.

Hmmm..... are you sure????
anyerrors=(!ok ? true : anyerrors);
What this should do is, set anyerrors to false first then, if we get a 'false' (!ok) from the validation, we set anyerrors to true.
If the validation returns tru, then we just do a dummy operation of making anyerrors equal anyerrors.
Problem is, if your validation doesn't return anything, I think THAT is the problem. Try this instead
anyerrors=(ok==false ? true : anyerrors);
This way if you slipped and did not return an explicit true, which I will bet is the issue here, it will explicitly look for a false.
!ok is false, OR no value.

[charlesh]

Jmarc,

I think I did what you mention above, just a bit backhanded way of getting there. First, I set all error vars to "true" that way, each validation function has to explicitly make them true or leave them false:

 var usernameerror=true;
    var pworderror=true;
    var emailerror=true;
    var firstnameerror=true;
    var lastnameerror=true;

By the way, I found out the hard way about variable declaration as it relates to scope in JavaScript. Weird thing is that if you declare a variable with the word 'var' inside a function, it is private. To make it global, drop the var. Strange how that works. Outside a function, variables are global. How 'bout that? Strange and bewildering.

Anyway, I'm still trying to wrap my head around your way. Give me a little more time with it... and thanks again!