[jQuery] unable to create validator that prevents transition to next field on errors. [ $(this).focus() this.focus() both fail ]
Hi
I'm new to jquery and was making pretty good progress until this silly
problem started bogging me down.
I am sure this is something people do all the time, but i could find
no good samples to work from...
If anyone could point out what i'm doing wrong, or what the trick is,
i'd greatly appreciate it !
The simple form below has an input with name=animal. the validator
tries to check if the user is typing in 'dog' or 'cat'.. both of which
are invalid... I try to keep the user in the invalid field without
transitioning to the next field.. but even when the alert box comes up
i see a transition to the next field...
well.. thnx in advance for your help and advice !
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>jQuery | Example</title>
<meta http-equiv="Content-type" content="text/html;
charset=utf-8" />
<meta http-equiv="Content-Language" content="en-gb" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="expires" content="-1" />
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
// is document ready?
$(document).ready(function() {
alert ('readdyy');
$('#checked').change(validate);
function validate() {
alert("dddoing validate");
if (this.value == "dog") {
alert("no dogs allowed");
this.focus();
this.select();
return false;
}
if (this.value == "cat") {
alert("no cats allowed");
$(this).focus();
$(this).select();
return false;
}
return true;
}
});
</script>
</head>
<body>
<form>
...animal:
<input type="text" id="checked" name="animal" />
<br />
...color:
<input type="text" name="color" />
</form>
</body>
</html>
chris
--
Chris Bedford
Founder & Lead Lackey
Build Lackey Labs
http://buildlackey.com