validating a form using method=get?

[ingernet]

Hi all,

I'm required to validate a form which (for really stupid and unchangeable reasons) has to use method=get. The code I have right now submits the form even if the values are invalid, which is not what I want to have happen.

code on jstest.html:

<table align=center><tr><td align=left style="font-size:13px; color:green;">
<b>Alpha numeric Testing :</b> <br>
Enter a character / string and test it<br>
<form name="test" method=get action="jstest2.html">
<script language=javascript>
            
function checkit(alphane,alphanf)
{
// 1. check the first string.
    var numaric = alphane;
    var alphacheck = 0;
    // 1A. check to make sure every character is [A-Z], [0-9]
    for(var j=0; j<numaric.length; j++) {
          var alphaa = numaric.charAt(j);
          var hh = alphaa.charCodeAt(0);
          if((hh > 47 && hh<59) || (hh > 64 && hh<91) || (hh > 96 && hh<123)) {
          } else    {
             alphacheck = alphacheck + 1;
          }
    }
 // 1B. now look for string length
       
 if (alphacheck == 0) {
    if (numaric.length <= 9 || numaric.length >= 17) {
        alphacheck = alphacheck + 1;
    }
}
       
    if (alphacheck > 0) {
        var alerterror = "Invalid Serial Number.  Please try again.";
    } else {
    // 2. assuming that the first string is good,
    // compare the second string to the first string to make sure they match.
       
        var string1 = alphane;
        var string2 = alphanf;
        if (string1 != alphanf) {
            var alerterror = "Serial numbers do not match. Please try again."
        }
    }
       
    // 3. If there's an error, throw it.
       
    if (alerterror) {
        window.alert(alerterror);
        return false;
    } else {
        return true;
    }
}
       
</script>
<input name=u11 type=text> [ e.g: <b>alfha</b> or <b>alp#num</b>]<br>
<input name=u1a type=text> [ e.g: <b>alfha</b> or <b>alp#num</b>]<br>
<input type=submit value=validate onClick="javascript:checkit(test.u11.value,test.u1a.value);">
</form>
</td></tr></table>

In case you hadn't gleaned it from my onClick event, I want it to validate the strings and only submit the form if the strings pass all tests; otherwise, it just sits there like a lump and lets the user try again.

Anyone have any thoughts on what I might be doing wrong?

Thanks!
Inger

 

[trollacious]

Put the call to the validation function in the onsubmit event handler.

<form name="test" onsubmit="return checkit(this.u11.value,this.u1a.value);" action="jstest2.html" method="get">

Lee

 

[ingernet]

that works great, thanks! i'd forgotten the "return" aspect of it.

a sheepish javascript newbie,
inger

 

[ingernet]

...well, it works great in theory, except:

because i'm trying to embed this javascript inside form tags that I can't edit, i can't use the "onsubmit" argument for the opening form tag.

i've been playing around with something like

document.forms[0].onsubmit = checkit(this.u11.value,this.u1a.value);

...but the form just processes to jstest2.html, even if the values fail the test.

any other ideas?

thanks!
inger

 

[trollacious]

This:

document.forms[0].onsubmit = checkit(this.u11.value,this.u1a.value);

will only work within the form tag because the this keyword refers to the object containing it. You can try

document.forms[0].onsubmit = checkit(document.forms[0].u11.value,document.forms[0].u1a.value);

but otherwise I'd use error checking on the page submitted to.

Lee

 

[ingernet]

...and the other thing is, i just realized that i'm referring the text fields using the form name ("test"), which works great on my prototype but won't work at all on the actual form (whose form tag i can't edit and therefore can't give a name to).

would somebody please be so kind as to tell me how i can refer to these text fields using document.forms[0] in the reference instead of "test" ?

someday, i will be much better at this. if anyone needs any php or coldfusion help, i'm happy to reciprocate....

inger

 

[trollacious]

I answered your question in my previous reply (but missed the return keyword), but you can also use the form's associative array, among other things.

document.forms[0].onsubmit = [b][red](return[/red][/b] checkit(document.forms[0].elements['u11'].value,document.forms[0].elements['u1a'].value));

or you can use

document.getElementByName('u1a')[0]

Lee

 

[trollacious]

I answered your question in my previous reply (but missed the return keyword), but you can also use the form's associative array, among other things.

document.forms[0].onsubmit = [b][red](return[/red][/b] checkit(document.forms[0].elements['u11'].value,document.forms[0].elements['u1a'].value));

or you can use

document.getElementsByName('u1a')[0]

Lee

 

[ingernet]

i got it worked out, thanks so much!