Form Validation [Archive] - CodingForums.com

charon

05-09-2003, 08:01 AM

how do i use the javascript (client side) to validate user do not enter duplicate "Product_ID" in the form fields. just assume that need to enter 5 product's details into the system.

brothercake

05-09-2003, 12:41 PM

beetle has a wicked form validator - http://www.peterbailey.net/fValidate/

Randy Smith

05-09-2003, 07:48 PM

Beetle's fValidator is a fine piece of coding but I didn't see where it checks for duplicate values. I have the same challenge as Charon. I'm asking the user on my form to rank items for their importance and can not have duplicate values submitted to the database. Here's the form if someone would like to take a look:
http://www.scisurvey.hmdnsgroup.com/

Ideas anyone? Thank you!

arnyinc

05-09-2003, 08:05 PM

Here's a link with what you need http://www.orafusion.com/js.htm (go to number 3 on the list).

I cleaned it up a little bit because I was interested to see how it works. I'm still a little bit lost, but it works.

<html>
<head>
<script>
function check_selection(elt, form){

var name=elt.name;
var index=elt.selectedIndex

for(var i=0;i<form.length;i++){
var_name=form.elements[i].name;
var_index=form.elements[i].selectedIndex;
if(var_name.substring(0,9)=='countries'){
if(var_name!=name&&index!=0&&var_index==index){
alert("Duplicate countries selected! Please choose again.");
elt.selectedIndex=0;
elt.focus();
return false;
}
}
}
return true;
}
</script>
</head>
<body>
<form name="country">
c1:
<select name="countries_1" onchange="check_selection(this, this.form)">
<option></option>
<option value="1">USA</option>
<option value="2">UK</option>
<option value="3">France</option>
<option value="4">Mexico</option>
</select>
c2:
<select name="countries_2" onchange="check_selection(this, this.form)">
<option></option>
<option value="1">USA</option>
<option value="2">UK</option>
<option value="3">France</option>
<option value="4">Mexico</option>
</select>
c3:
<select name="countries_3" onchange="check_selection(this, this.form)">
<option></option>
<option value="1">USA</option>
<option value="2">UK</option>
<option value="3">France</option>
<option value="4">Mexico</option>
</select></form>
</body>
</html>

beetle

05-09-2003, 09:19 PM

Indeed, fValidate doesn't include a provision for that (thanks for the props anyhow, bcake :thumbsup: )

Why not just let HTML and the proper form controls do this for you?

<html>
<head>
<title>test</title>

</head>

<body>

<form>
1<input type="radio" name="one" value="Arm/Hand" />
2<input type="radio" name="two" value="Arm/Hand" />
3<input type="radio" name="three" value="Arm/Hand" />
4<input type="radio" name="four" value="Arm/Hand" />
5<input type="radio" name="five" value="Arm/Hand" />
6<input type="radio" name="six" value="Arm/Hand" />
7<input type="radio" name="seven" value="Arm/Hand" />
Arm/Hand function
<br />
1<input type="radio" name="one" value="Upper Body/trunk" />
2<input type="radio" name="two" value="Upper Body/trunk" />
3<input type="radio" name="three" value="Upper Body/trunk" />
4<input type="radio" name="four" value="Upper Body/trunk" />
5<input type="radio" name="five" value="Upper Body/trunk" />
6<input type="radio" name="six" value="Upper Body/trunk" />
7<input type="radio" name="seven" value="Upper Body/trunk" />
:Upper body/trunk strength and balance*
<br />
1<input type="radio" name="one" value="Bladder/bowel" />
2<input type="radio" name="two" value="Bladder/bowel" />
3<input type="radio" name="three" value="Bladder/bowel" />
4<input type="radio" name="four" value="Bladder/bowel" />
5<input type="radio" name="five" value="Bladder/bowel" />
6<input type="radio" name="six" value="Bladder/bowel" />
7<input type="radio" name="seven" value="Bladder/bowel" />
:Bladder/bowel function, elimination of Dysreflexia*
<br />
1<input type="radio" name="one" value="Sexual function" />
2<input type="radio" name="two" value="Sexual function" />
3<input type="radio" name="three" value="Sexual function" />
4<input type="radio" name="four" value="Sexual function" />
5<input type="radio" name="five" value="Sexual function" />
6<input type="radio" name="six" value="Sexual function" />
7<input type="radio" name="seven" value="Sexual function" />
:Sexual function*
</form>

</body>
</html>
Style it up a bit, put it in a table or whatever and I think it would be more user-friendly as well.

Randy Smith

05-09-2003, 11:53 PM

Arnyinc & Beetle,

Many thanks for the quick replies! I decided to use the OraFusion solution to preserve my vertical ranking orientation. Works like a charm! I have a couple more questions if you're game. I'm new here. Can't you tell ;-)

The script I'm using to validate required fields is failing on my radio button groups. It tells me I need to complete the fields even though I check *one* of the values. I believe it's generating an error because both values (Yes/No) are not selected. This script does not contain the radio button fields as mandatory though when the fields were added it failed. What do you think? Here's the validation script :

function formCheck(formobj){
// name of mandatory fields
var fieldRequired = Array("injurylvl", "injuryyr", "birthyr", "ranking_1", "ranking_2", "ranking_3", "ranking_4", "ranking_5", "ranking_6", "ranking_7", "zipcode");
// field description to appear in the dialog box
var fieldDescription = Array("Injury Level", "Injury Year", "Birth Year", "Arm/Hand must be ranked", "Upper/Trunk must be ranked", "Bladder/Bowel must be ranked", "Sexual must be ranked", "Pain must be ranked", "Sensation must be ranked", "Walking must be ranked", "Zipcode");
// dialog message
var alertMsg = "Please complete the following fields:\n";

var l_Msg = alertMsg.length;

for (var i = 0; i < fieldRequired.length; i++){
var obj = formobj.elements[fieldRequired[i]];
if (obj){
switch(obj.type){
case "select-one":
if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == "Rank" || obj.options[obj.selectedIndex].text == "Year" || obj.options[obj.selectedIndex].text == "Injury"){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
case "select-multiple":
if (obj.selectedIndex == -1){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
case "text":
case "textarea":
if (obj.value == "" || obj.value == null){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
default:
if (obj.value == "" || obj.value == null){
alertMsg += " - " + fieldDescription[i] + "\n";
}
}
}
}

if (alertMsg.length == l_Msg){
return true;
}else{
alert(alertMsg);
return false;
}
}

Second question: I have a script formatting my phone number input like so: (###) ###-####. I like the formatting but I want to strip off these characters before they hit the database. I want only the ten digits in the database. Should I strip these off with javascript? If so, any code samples available?

Last question: On the survey form I want to ensure that the BirthYr is <= to the InjuryYr. I can see that a "onchange" event will work but I'm not sure how to structure the function. How do I read the two relevant form fields into the function? This does not work:

var injuryyr =form.injuryyr
var birthyr = form.birthyr
function checkBirthYr(injuryyr, birthyr){
if(birthyr !<= injuryyr){
alert(Birth year must be equal to or before the Injury year);
return false;
}
}
Thanks again!

A1ien51

05-10-2003, 06:46 AM

Look at this post for the date validation:

http://www.codingforums.com/showthread.php?s=&threadid=18449

A1ien51

charon

05-19-2003, 04:54 AM

None of the example suite my needs. My situation is as below:

User be able to enter and save 10 records per time.

BookID Authour Publisher

There are 10 row of fields.

So, what I'm going to do is check the duplicate BookID before user Submit the Page.

cheesebagpipe

05-19-2003, 09:00 AM

Randy...

Had a go at your survey. See if there's anything you can use.

;)

Randy Smith

05-19-2003, 10:36 PM

Very kind of you. Your example code taught me how to accomplish a similar challenge in the future. No greater value in my opinion. "...Teach a man to fish..."

Please e-mail me your contact info and you'll get credit in the js file.