help with validation

glensimister · #1 Jul 26th, 2007, 14:58

Hi there!

basically i have built a form and validated the input using regular expressions. When the user enters an invalid entry (onChange) an alert box pops. This works fine. However alert boxes can create problems for visually impaired users who use screen magnification. So what i am trying to do is create an additional error msg at the side of the input box.

similar to the example shown here: http://www.xs4all.nl/~sbpoley/webmatters/formval.html

I attempted many ways of doing this and i cannot seem to get it to work. I have run the code through a javascript varifier so there should not be a typing/spelling errors.

Here is the function:-

Code: Select all

function ValidatePhoneNum()
{
    
    var PhoneNum = document.Form.shipPhoneNumber.value;
    var n = document.getElementById("contactNum");
    var msg=n.nextSibling.nodeValue; //this is the part which seems to be  the issue

var re = /^\d{4}\s*\d{7}|\d{5}\s*\d{6}$/;
    if (!re.test(PhoneNum)) 
    {
            
            alert("Please re-enter Phone number");
            document.Form.shipPhoneNumber.focus();//this does not work either
            msg = "Please re-enter Phone number";            //this will replace "required"
                return false;
     } else {return true;}

}

And here is the html:-

Code: Select all

<td>Contact Telephone Number</td>

                <td id=contactNum><input type="text" name="shipPhoneNumber" maxlength="30" 
                    onChange="return ValidatePhoneNum()"/>Required</td>

If anyone can sugguest a reason why this does not work i would greatly appreciate it.

Thanks!

Paramiliar · #2 Jul 26th, 2007, 20:20

well the other alternative is to place a blank DIV placeholder next to the fields, then when you use the alert box just do an
document.getElementById("divid").innerHTML = "Error message here";

there we go.

Rob · #3 Jul 26th, 2007, 22:58

I would say that innerHTML is the way to go.

For streamlining your code (for validation and Search engines) to avoid blank elements, you could pick upon the field itself and use various methods to add a child or sibling element to target innerHTML.

Something to think about anyway!

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Help with validation	snappy	Web Page Design	4	Mar 27th, 2008 18:33
w3c validation	cocoonfx	Web Page Design	8	Jul 21st, 2007 13:55
CSS validation	VanessaJW	Web Page Design	17	May 24th, 2007 19:59
CSE for validation	nextgen	Scripts and Online Services	3	Jan 30th, 2007 03:41
Validation help	Powderhound	Web Page Design	13	Nov 4th, 2006 20:53

		Webforumz.com > Main Forums > Program Your Website > JavaScript Forum
help with validation