JavaScript and client side scripting.
Moderator: General Moderators
jk2008
Forum Newbie
Posts: 6 Joined: Sun Jan 04, 2009 4:48 pm
Post
by jk2008 » Fri Oct 19, 2012 4:57 pm
Hi I have the below code for validation. Everything works fine except for the confirm email and checkbox validation function. Can I get some help to make those 2 item works? Thanks.
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>
<script type="text/javascript">
function check (f) {
var done = true, e, i = 0;
while (e = f.elements[i++]) {
if (
(e.type == 'text' && !/\S/.test (e.value)) ||
(e.name == 'email' && !is_email(e.value)) ||
(e.name == 'chkemail' && !checkEmail(e.value)) ||
(e.name == 'term' && !chckBox(e.value))
) {
e.parentNode.className = 'highlight';
e.onfocus = function () {this.parentNode.className = '';}
done = false;
}}
return done;
}
function is_email(email) {
var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
return reg.test(email);
}
function checkEmail(chkemail) {
var chkemail= chkemail.value;
if (chkemail.value != email.value) {
return test(chkemail);
}
function chckBox() {
if (
term == !checkbox.checked)
{
return done;
}
}
</script>
<style type="text/css">
form {
margin:auto;
width:11em
}
fieldset {
padding:1ex
}
label {
display:block;
margin:0;
text-align:left
}
label.highlight input {
border:dotted 1px #C0C
}
button {
display:block;
margin:auto
}
</style>
</head>
<body>
<form action="some-script.pl" onsubmit="return check (this);">
<fieldset>
<legend>Example</legend>
<label>Name
<input type="text" name="name">
</label>
<label>Email
<input type="text" name="email">
</label>
<label>ConEmail
<input type="text" name="chkemail">
</label>
<label>Terms
<input type="checkbox" name="term">
</label>
<button type="submit">Submit</button>
</fieldset>
</form>
</body>
</html>
requinix
Spammer :|
Posts: 6617 Joined: Wed Oct 15, 2008 2:35 am
Location: WA, USA
Post
by requinix » Fri Oct 19, 2012 6:53 pm
The problem is how many inconsistencies there are between how you're calling checkEmail and chckBox and how the functions actually work. There are a lot.
But you don't even need them in the first place.
Code: Select all
(e.name == 'chkemail' && !e.checked) ||
(e.name == 'term' && !e.checked)
jk2008
Forum Newbie
Posts: 6 Joined: Sun Jan 04, 2009 4:48 pm
Post
by jk2008 » Fri Oct 19, 2012 11:52 pm
The checkbox make sense but for confirm email don't I need to compare the value of email with chkemail in a function? Sorry I am new to JS and don't know how to do that. Also, how do I validate list/drop down menu and radio button. I tried to use the !e.checked for radio group but it doesn't work.
Thanks.
jk2008
Forum Newbie
Posts: 6 Joined: Sun Jan 04, 2009 4:48 pm
Post
by jk2008 » Mon Oct 22, 2012 3:23 pm
Can I please get some help with how to validate a radio group (1 is selected) and compare value from 2 field (i.e. confirm email address) with the functionality from my first post?
Thanks.
requinix
Spammer :|
Posts: 6617 Joined: Wed Oct 15, 2008 2:35 am
Location: WA, USA
Post
by requinix » Mon Oct 22, 2012 3:46 pm
I didn't reply? I remember writing it...
The validation would be a lot simpler if you just validated the pieces individually. The loop overcomplicates the problem.
Code: Select all
var emailre = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
if (
// name
!/S/.test(f.elements.name.value) ||
// email
!emailre.test(f.elements.email.value) ||
// chkemail
f.elements.email.value != f.elements.chkemail.value ||
// term
!f.elements.term.checked
) {
// invalid
}