Menu
Hello,
I tried to create a function to reduce some in line code. However something is wrong with the function call getGenderChoice() because the code stops working. If I comment out getGenderChoice() and uncomment the lines that would be in the function it works properly. What would possibly be wrong with a function call that seems to follow function rules?
Thanks
[code=php]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html>
<head>
<title>Main</title>
<script type=”text/javascript”>
function addEventSimple(obj,evt,fn) {
if (obj.addEventListener)
obj.addEventListener(evt,fn,false);
else if (obj.attachEvent)
obj.attachEvent(‘on’+evt,fn);
}
var validationErrorMessage = new Object();
validationErrorMessage[‘required’] = ‘This field is required’;
var validationFunctions = new Object();
validationFunctions[“required”] = isRequired;
function isRequired(formField)
{
switch (formField.type) {
case ‘text’:
case ‘textarea’:
case ‘select-one’:
if (formField.value)
return true;
return false;
case ‘radio’:
var radios = formField.form[formField.name];
for (var i=0;i<radios.length;i++) {
if (radios[i].checked) return true;
}
return false;
case ‘checkbox’:
return formField.checked;
}
}
var W3CDOM = document.createElement && document.getElementsByTagName;
function validateForms() {
if (!W3CDOM) return;
var forms = document.forms;
for (var i=0;i<forms.length;i++) {
forms[i].onsubmit = validate;
}
}
addEventSimple(window,’load’,validateForms);
function validate() {
var els = this.elements;
var validForm = true;
var firstError = null;
for (var i=0;i<els.length;i++) {
if (els[i].removeError)
els[i].removeError();
var req = els[i].getAttribute(‘validation’);
if (!req) continue;
var reqs = req.split(‘ ‘);
for (var j=0;j<reqs.length;j++) {
if (!validationFunctions[reqs[j]])
validationFunctions[reqs[j]] = emptyFunction;
var OK = validationFunctions[reqs[j]](els[i]);
if (OK != true) {
var errorMessage = OK || validationErrorMessage[reqs[j]];
writeError(els[i],errorMessage)
validForm = false;
if (!firstError)
firstError = els[i];
break;
}
}
}
getGenderChoice();
// get gender radio choice
//var formGender=document.forms[0];
//var choices = formGender.elements.gender;
//for(var i=0;i<choices.length;i++)
//{ if(choices[i].checked)
// break;
// else { validForm = false; } }
// form not valid return with error message
if (!validForm) {
alert(“Errors have been found” );
location.hash = ‘#startOfForm’;
return;
}
// alert order is OK
alert(“Your order has been submittedn” + “Name: ” + document.getElementById(‘name’).value +
“nGender: ” + choices[i].value );
return validForm;
}
function getGenderChoice()
{
// get gender radio choice
var formGender=document.forms[0];
var choices = formGender.elements.gender;
for(var i=0;i<choices.length;i++)
{ if(choices[i].checked)
break;
else { validForm = false; }
}
}
</script>
</head>
<body>
<form name=”form1″ id=”startOfForm”>
<table><tbody>
<tr>
<td class=”question”><label for=”name”>Name</label></td>
<td><input name=”name” id=”name” validation=”required” /></td>
</tr>
<tr>
<td class=”question”>Gender</td>
<td>
<input type=”radio” name=”gender” value=”male” rel=”none” id=”gender_male” validation=”required”>
<label for=”gender_male”>Male</label><br />
<input type=”radio” name=”gender” value=”female” rel=”none” id=”gender_female” validation=”required”>
<label for=”gender_female”>Female</label><br />
</td>
</tr>
<tr>
<td colspan=2><input type=”submit” value=”Submit form”></td>
</tr>
</tbody></table>
</form>
</body>
</html>