Using regexp to validate simple form

**Hagelbrakare** · Dec 4 '06, 10:54 AM

Hi! I made a few changes in you javascript code. I'm not sure what you wanted to check when it comes to fullname, but you checked if it did not contain a digit which I'm quite sure you didn't meen to :) Now it checks if it is a full name ( ex "chandler bing" or "chandler bing bong") not just "chandler".

Gender will actually return an array because there are two elements with same name. You have to check if either of them are checked.

contry.value will return "select" when no city is selected. I suppose that it should be city all the way.

validating an e-mail is hard, but this little regex just checks the end.

Code:

function validate () {
	var fullname = document.module102form.fullname.value;
	var country = document.module102form.country.value;
	var email = document.module102form.email.value;
		
	var fullnameRegExp=/^\D+( \D+)+$/;
	var emailRegExp=/[.](com|net|edu|gov)$/;
		
	if (!fullnameRegExp.test(fullname)) {
	    alert("Please reenter your FULL NAME.");
	    return false;
	}
		
	if (!document.module102form.gender[0].checked && !document.module102form.gender[1].checked) {
	    alert("Please select a GENDER.");
	    return false;
	}

	if (country == "select") {
	    alert("Please select a CITY.");
	    return false;
	}

	if (!emailRegExp.test(email)) {
	    alert("Please valid EMAIL."); 
	    return false;
	}

	alert("Thanks for completing the form.");
	return true;
}

**TokyoJ** · Dec 4 '06, 12:24 PM

Hagelbrakare,
Thank you. I'm dusting off my brain so the changes you made are clear.

So is this the correct onSubmit?

onSubmit="retur n validate(this); "

I'm not clear on the differences between

onSubmit="retur n validate(this); "

and

onSubmit="retur n validate_form() ;"

and

onSubmit="retur n validate();"

Could you explain which is best for this form(in simple terms)?
Cheers,
John

**Hagelbrakare** · Dec 4 '06, 12:38 PM

I'm sorry, I forgot to tell you.

As you can see the function is declared as "function validate()" which meens that functions name is validate and that it takes no arguments (the parentesis is empty). This meens that you should call it by validate(). validate() will return true or false. onsubmit should return what validate returns. I know that is sounds a little bit too much already, but onsubmit="retur n validate()" will to the job.

You are welcome to ask as many questions as you want :) Is there anything in the javascript function that puzzles you?

**TokyoJ** · Dec 4 '06, 02:09 PM

That clears it up and makes sense. Used onSubmit return validate (); and worked well.
One point I'm still vague on is this... for validations, when using

Code:

var fullname = document.feedback.fullname.value;// TEXT BOX
var city = document.feedback.city.value;          // DROPDOWN 
var gender = document.feedback.gender.value;  	// DROPDOWN
var area = document.feedback.area.value; 	// TEXT BOX
		
var fullnameRegExp=/^\D+( \D+)+$/;
var emailRegExp=/[.](com|net|edu|gov)$/;
var areaRegExp=/^[a-zA-z]+$ /;
var cityRegExp=/ /;
var phoneRegExp=/ /;
var cellRegExp=/ /;
var emailRegExp=/ /;.

**TokyoJ** · Dec 4 '06, 02:35 PM

(my 5 min of allowed 'edit' time expired so am posting a new reply)
Thank you. That makes sense and it works.
There is one point that I'm getting hung up on...using VAR in RegExp validations. For example here I use 4 fields, fullname, gender, city, and interests; each with a different input style.

var fullname = document.feedba ck.fullname.val ue; // TEXT BOX
var city= document.feedba ck.city.value; // DROPDOWN MENU
var interest = document.feedba ck.interest.val ue; // CHECKBOX
var gender = document.feedba ck.gender.value ; // RADIO BUTTON

then in the next step, xxxRegExp is used for only TEXTBOX var's, such as
var fullnameRegExp=/^\D+( \D+)+$/;
correct?

If so then this leaves RADIO BUTTONS, DROPDOWN MENUS and CHECKBOXES to be validated later in the code, in a type of 'self-contained' (if that makes sense) expression. Such as

if (city == "select") {
alert("Please select a CITY.");
return false;
}

Am I thinking on the right track in why xxxRegExp is used for only some of the VAR's and not others?
Thank you.

**Hagelbrakare** · Dec 4 '06, 02:50 PM

Using regular expression to validate a select box is some what overkill.

Code:

<select name="s_city">
<option value="">- Choose a city -</option>
<option value="New York">New York</option>
</select>

In this case the value of the select will be an empty string if the user didn't selected a city. You can decide what value it will get. You don't need a regular expression because the user simply can not choose something else.

When it comes to the area code you can use a regex. I don't know how such a code looks because I'm not american, but the example you gave would except everything from "a" to "aaaaafffffffff sssssssssdddddd dddd".

**Hagelbrakare** · Dec 4 '06, 02:59 PM

Checkboxex and radio buttons are a different story. They are checked.

If you have a checkbox you just check if it's checked.

Code:

if (document.myform.mycb.checked)
do something;

With radio buttons you get the an array with all radio button with the same name. Unless it's just one, then it will work just like a checkbox.

Code:

<input type="radio" name="car">BMW
<input type="radio" name="car">Mercedes
<input type="radio" name="car">Jaguar

if (document.myform.car[0].checked) // you have a bmw
if (document.myform.car[1].checked) // you have a mercedes
if (document.myform.car[2].checked) // you have a jaguar.

**TokyoJ** · Dec 5 '06, 12:36 AM

That makes sense. Thank you. I'll make a note of the radio button examples.
BTW I'm not american either. I just happen to live in Alaska for work...hopefull y I'll be able to find a job in a warmer climate. :-)
Thank you for your help.
It is greatly appreciated.

**Hagelbrakare** · Dec 5 '06, 08:56 AM

You're welcome :) Warmer climate could work for me too :) I live in Sweden. Probably not as cold as Alaska, but not like Thailand either ;)

**TokyoJ** · Dec 5 '06, 02:23 PM

Tack själv.
Everying I've seen/read/heard about Sweden has been good. Very few countries can say that.
Can I ask one more question?
Using the two below VAR's, as examples, what script could I use to make sure the phone # and cell # are different? Alert appears if user enters the same # in both fields. (it's not a big issue, just want to learn more).

Thank you for taking the time to educate a lesser skilled person.
var phone = document.feedba ck.phone.value;
var cell = document.feedba ck.cell.value;

and
if (!phoneRegExp.t est(phone)) {
alert("Please reenter your PHONE NUMBER.");
return false;
}
if (!cellRegExp.te st(cell)) {
alert("Please reenter your CELL NUMBER.");
return false;
}

Cheers,

**Hagelbrakare** · Dec 5 '06, 03:01 PM

I'm glad that you think that Sweden might be a good place to be :)

This little snippet of code will validate the number and check if they're identical. I was assuming that a phone # can start with "+".

Code:

function checkPhones() {
	var reNumber = /^[+]?\d+$/;
	var vPhone = document.getElementById("t_phone").value;
	var vCell = document.getElementById("t_cell").value;
	
	if (!reNumber.test(vPhone)) {
		alert("Not valid Phone Number");
		return;
	}
	if (!reNumber.test(vCell)) {
		alert("Not valid Cell Phone Number");
		return;
	}
	if (vPhone == vCell) {
		alert("The numbers are identical");
		return;
	}
	
	alert("They're good");
}

Using regexp to validate simple form

Using regexp to validate simple form

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment