I have a web page that is supposed to take in a user's contact information and validate it, however my script doesn't seem to be functioning and I'm not sure why.
I know that you can get the input of a text field by using document.getElementById(name).value
which is what I have, but my submit
button doesn't respond with anything.
Any suggestions?
HTML:
<form>
First Name:<br>
<input type="text" id="first" name="firstname"><br>
Last Name:<br>
<input type="text" id="last" name="lastname"><br>
Street Address:<br>
<input type="text" id="addr" name="address"><br>
City:<br>
<input type="text" id="city" name="city"><br>
State:<br>
<input type="text" id="state" name="state"><br>
Zip Code:<br>
<input type="text" id="zip" name="zip"><br>
Phone #:<br>
<input type="text" id="phone" name="phone"><br>
E-mail Address:<br>
<input type="text" id="email" name="email"><br>
<br>
<button type="button" onclick="verify()">Submit</button>
</form>
JavaScript:
function verify() {
var fname, lname, addr, city, state, zip, phone, email;
var alpha = /[A-z]/i;
fname = document.getElementById('first').value;
lname = document.getElementById('last').value;
addr = documnet.getElementById('addr').value;
city = document.getElementById('city').value;
state = document.getElementById('state').value;
zip = document.getElementById('zip').value;
phone = document.getElementById('phone').value;
email = document.getElementById('email').value;
var values = [fname, lname, addr, city, state, zip, phone, email];
window.alert(fname);
/*
//Check to see if any fields are blank
for(var i = 0; i < values.length; i++) {
if(values[i] == "") {
window.alert("Must have a value in each field");
return false;
}
}
//Check to see if text fields contain non-alphabetic characters
if(!alpha.test(fname)) {
window.alert("First name must contain only alphabetic characters");
return false;
}
if(!alpha.test(lname)) {
window.alert("Last name must contain only alphabetic characters");
return false;
}
if(!alpha.test(city)) {
window.alert("City must contain only alphabetic characters");
return false;
}
if(!alpha.test(state)) {
window.alert("State must contain only alphabetic characters");
return false;
}
*/
}
You have a typo in
addr = documnet.getElementById('addr').value;
it should be
addr = document.getElementById('addr').value;
notice the spelling of document
Other than that, your code seems to be working fine..see the fiddle
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.