PDA

View Full Version : form validation


dylanb
06-13-2008, 07:51 AM
Hi, i have this working in firefox, but it will not in IE, it give an error ' expected identifier, string or number on line(commented below), Char 5

<div style="width:180px; float: left">



<form name="contact" id="contactus" class="contact" method="post" action="mail.php#contact">


<?php
$ipi = getenv("REMOTE_ADDR");
$httprefi = getenv ("HTTP_REFERER");
$httpagenti = getenv ("HTTP_USER_AGENT");
?>

<input type="hidden" name="ip" value="<?php echo $ipi ?>" />
<input type="hidden" name="httpref" value="<?php echo $httprefi ?>" />
<input type="hidden" name="httpagent" value="<?php echo $httpagenti ?>" />


<label class="desc" for="name">
Name
<span class="req">*</span>
</label>

<div>
<input id="name"
class="field"
name="name"
tabindex="1"
type="text" maxlength="255" value=""
/>
</div>





<label class="desc" for="email">
Email address
<span class="req">*</span>
</label>

<div>
<input id="email"
class="field"
name="email"
tabindex="2"
type="text" maxlength="255" value=""
/>
</div>





<label class="desc" for="telephone">
Telephone number
</label>

<div>
<input id="telephone"
class="field"
name="telephone"
tabindex="3"
type="text" maxlength="255" value=""
/>
</div>

<label class="desc" for="house">
House number
</label>

<div>
<input id="house"
class="field"
name="house"
tabindex="4"
type="text" maxlength="255" value=""
/>
</div>

<label class="desc" for="postcode">
Postcode
</label>

<div>
<input id="postcode"
class="field"
name="postcode"
tabindex="5"
type="text" maxlength="255" value=""
/>
</div>

</div>
<div style="width:280px; float: left">
<label class="desc" for="detail">
Message
<span class="req">*</span>
</label>

<div>
<textarea id="message"
class="field"
name="detail"
tabindex="6" rows="1" cols="1"></textarea>
</div>

<input id="send" type="submit" tabindex="7" value="Send Message" />
</form>
<script type="text/javascript">

cleanValidator.init({
formId: 'contactus', <!--### This line gives the error ###-->
inputColors: ['#000000', '#000000'],
errorColors: ['#000000', '#990000'],
isRequired: ['name','email','message'],
isEmail: ['email'],
});

</script>

</div>
</div>

external js file is;


var cleanValidator = {
init: function (settings) {
this.settings = settings;
this.form = document.getElementById(this.settings["formId"]);
formInputs = this.form.getElementsByTagName("input");

// change color of inputs on focus
for(i=0;i<formInputs.length;i++)
{
if(formInputs[i].getAttribute("type") != "submit") {
input = formInputs[i];
input.style.background = settings["inputColors"][0];
input.onblur = function () {
this.style.background = settings["inputColors"][0];
}
input.onfocus = function () {
this.style.background = settings["inputColors"][1];
}
}
};
this.form.onsubmit = function () {
error = cleanValidator.validate();
if(error.length < 1) {
return true;
} else {
cleanValidator.printError(error);
return false;
}
};
},
validate: function () {
error = '';
validationTypes = new Array("isRequired", "isEmail", "isNumeric");
for(n=0; n<validationTypes.length; n++) {
var x = this.settings[validationTypes[n]];
if(x != null) {
for(i=0; i<x.length; i++)
{
inputField = document.getElementById(x[i]);
switch (validationTypes[n]) {
case "isRequired" :
valid = !isRequired(inputField.value);
errorMsg = "is a required field.";
break;
case "isEmail" :
valid = isEmail(inputField.value);
errorMsg = "is an invalid email address.";
break;
case "isNumeric" :
valid = isNumeric(inputField.value);
errorMsg = "can only be a number.";
break;
}
if(!valid) {
error += x[i]+" "+errorMsg+"\n";
inputField.style.background = this.settings["errorColors"][0];
inputField.style.border = "1px solid "+this.settings["errorColors"][1];
} else {
inputField.style.background = this.settings["inputColors"][0];
inputField.style.border = '1px solid';
}
}
}
}
return error;
},
printError: function (error) {
alert(error);
}
};

// returns true if the string is not empty
function isRequired(str){
return (str == null) || (str.length == 0);
}
// returns true if the string is a valid email
function isEmail(str){
if(isRequired(str)) return false;
var re = /^[^\s()<>@,;:\/]+@\w[\w\.-]+\.[a-z]{2,}$/i
return re.test(str);
}
// returns true if the string only contains characters 0-9 and is not null
function isNumeric(str){
if(isRequired(str)) return false;
var re = /[\D]/g
if (re.test(str)) return false;
return true;
}

YMas
06-20-2008, 06:34 PM
Hello,
I think the comma at the end of:

isEmail: ['email'],

may be the culprit.

Regards,
YMas