469,625 Members | 1,087 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,625 developers. It's quick & easy.

How do I set field focus using DOM?

Hi,

I have a form with date fields, I have created event listeners to
check for a validate when leaving the field (onblur). If invalid, I
need it to set the field back to the default value, select the field,
and return focus to the field. All is working except the focus. If
someone can point out the error in my code, it would be appreciated.

function validateDateEntered(e) {
var elementValue = getSrcElement(e);
if(!dateCheck(elementValue.value,'%MM/%DD/%YYYY') && !
isWhitespace(elementValue.value)) {
alert('Invalid Received date - format is MM/DD/YYYY and must be a
valid date');
elementValue.value=elementValue.defaultValue;
elementValue.select();
elementValue.focus();
if (e.preventDefault) {
e.preventDefault();
}
e.returnValue = false;
}
}

function getSrcElement(e) {
elementClicked = 0;
if (window.event && window.event.srcElement) {
elementClicked = window.event.srcElement;
}
if (e && e.target) {
elementClicked = e.target;
}

return elementClicked;
}

Nov 6 '07 #1
2 1900
donpro said the following on 11/5/2007 11:47 PM:
Hi,

I have a form with date fields, I have created event listeners to
check for a validate when leaving the field (onblur). If invalid, I
need it to set the field back to the default value, select the field,
and return focus to the field. All is working except the focus. If
someone can point out the error in my code, it would be appreciated.

function validateDateEntered(e) {
var elementValue = getSrcElement(e);
That is, without a doubt, the worst way to get a reference to a field.
onchange="validateDateEntered(this)" and then your variable "e" is a
reference to the form field it got called from. Then you can simply set
e.focus(). You can even get the value with e.value.

Second, using onblur is one extremely obnoxious/ignorant way to validate
a field.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Nov 6 '07 #2
On Nov 6, 2:47 pm, donpro <donpro-2...@rogers.comwrote:
Hi,

I have a form with date fields, I have created event listeners to
check for a validate when leaving the field (onblur). If invalid, I
need it to set the field back to the default value, select the field,
and return focus to the field.
That is a really unfriendly thing to do, it will cause your users
great frustration. If you want to validate onblur (it's better to use
the change event), just put something next to the field to let the
user know that the content is invalid and let them fix it themselves.

All is working except the focus. If
someone can point out the error in my code, it would be appreciated.

function validateDateEntered(e) {
var elementValue = getSrcElement(e);
As Randy said, that is not a good strategy for getting a reference to
the element that fired the event. Have the handler pass this to the
function and you have your reference without further hassle:

<input onclick="validateDateEntered(this);" ... >

and in your script:

function validateDateEntered(element) {
// element is a reference to the element that
// called the function
...
}
[...]
function getSrcElement(e) {
elementClicked = 0;
if (window.event && window.event.srcElement) {
elementClicked = window.event.srcElement;
}
if (e && e.target) {
elementClicked = e.target;
}
return elementClicked;
}
A simple version of that function would be:

function getSrcElement(e) {
e = e || window.event;
return e && (e.target || e.srcElement);
}
Nov 6 '07 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

5 posts views Thread by 'bonehead | last post: by
2 posts views Thread by fish | last post: by
7 posts views Thread by Mike | last post: by
2 posts views Thread by Dave Griffiths | last post: by
reply views Thread by gheharukoh7 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.