...
PDA

extremely hard form validation

ShMiL
12-11-2004, 02:03 PM
look at this post here:
http://codingforums.com/showthread.php?t=42764

This code by Willy Duitt create dynamic fields according to a given input.

<script type="text/javascript">
<!--//
function addInputs(theInput){
var table = document.createElement('table');
table.id = 'hMembers';
var hMembers = document.getElementById('hMembers');
if(hMembers)theInput.parentNode.removeChild(hMembers);

if(theInput.value.match(/^\d+$/)){
var tbody = document.createElement('tbody');
for(var i=0; i<theInput.value; i++){
var row = document.createElement('tr');
var cell = document.createElement('td');
var num = document.createTextNode((i+1)+')');
cell.appendChild(num);
row.appendChild(cell);
tbody.appendChild(row);

var cell = document.createElement('td');
var name = document.createTextNode('name:');
var input = document.createElement('input');
input.size = 20;
input.name = 'name'+(i+1);
cell.appendChild(name);
cell.appendChild(input);
row.appendChild(cell);
tbody.appendChild(row);

var cell = document.createElement('td');
var age = document.createTextNode('age:');
var input = document.createElement('input');
input.size = 1;
input.name = 'age'+(i+1);
cell.appendChild(age);
cell.appendChild(input);
row.appendChild(cell);
tbody.appendChild(row);

var cell = document.createElement('td');
var sex = document.createTextNode('sex:');
var input = document.createElement('input');
input.size = 2;
input.name = 'sex'+(i+1);
cell.appendChild(sex);
cell.appendChild(input);
row.appendChild(cell);
tbody.appendChild(row);
} table.appendChild(tbody);
theInput.parentNode.insertBefore(table,theInput.nextSibling);
}

else{ alert('Please enter only numbers in this field!');
theInput.value = '';
theInput.focus();
}
}
//-->
</script>
</head>

<body>
<form method="get" action="">
How many in the household: <input type="text" onchange="addInputs(this)">
</form>


What I want to do is to check those fields.

Below is the code also written by Willy Duitt checks fields, but I can't make it check the fields which was created dynamically (in the code above).


<html>
<head>
<script type='text/javascript'>
window.onload=cycle;
function cycle() {
for (var i = 1; i < document.joinForm.suiteCounter.value; i++) {
var temp = document.joinForm['weekNumber' + i].value;
alert(temp);
}
}
</script>
</head>
<body>
<form name='joinForm'>
<input type='text' name='suiteCounter' value='4'>
<input type='text' name='weekNumber1' value='a'>
<input type='text' name='weekNumber2' value='b'>
<input type='text' name='weekNumber3' value='c'>
</form>
</body>
</html>


Can anyone help with this?

Thanks
Willy Duitt
12-11-2004, 02:26 PM
I do not understand what you are trying to check....
That the fields have been filled out and not empty??

Plus, the weekNumber[n] fields have nothing to do with the dynamically created inputs (name, age, sex) and without knowing how the two correlate to each other there is no way to know what is going on....

But the short answer to checking that all fields are filled out is to loop thru the form elements and checking the value.length...


function validate(form){
for(var i=0; i<form.elements.length; i++){
if(form.elements[i].value.length == 0){
alert('All fields must be filled out');
form.elements[i].focus();
return false;
}
}
}

And:
<form onsubmit="validate(this)".....


.....Willy
ShMiL
12-11-2004, 03:51 PM
I want to check if the age is numeric
Willy Duitt
12-11-2004, 04:16 PM
I want to check if the age is numeric


if(form.elements[i].name.match(/^age/i) && isNaN(form.elements[i].value)){
alert('Age must be a number');
form.elements[i].value = '';
form.elements[i].focus();
return false;
}


.....Willy

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum