onChange and onBlur events

Christoph

I'm trying to validate some HTML form elements when the
user tabs out of each element. However, I'm having some
problems.
It appears that the order of events is onChange followed
some time afterwards by onBlur. I believe this to be the
case because in my onChange script, if the validation fails,
I force focus back to the field element. However, the focus
still falls to the next field and not back to the field I tried to
force the focus to. So it seems to me that the browser is
actually tabbing out of the field only after the onChange
script runs.
Now, I can't just use onBlur because a part of my validation
is checking to make sure the field is not blank. So using
onBlur, when I tab out of a blank (or erroneous) field, it
creates an endless loop where to adjacent fields are triggering
their validation script when focus gets placed back to the
erroneous field.
So that brings me back to the onChange. Does anyone
know how I can keep focus on the erroneous field after
the onChange script fires? Because simply forcing focus
on the field doesn't seem to be working.

Thank you for your time and consideration.

thnx,
Christoph

Jul 23 '05 #1

Subscribe Post Reply

11261

Lee

Christoph said:

I'm trying to validate some HTML form elements when the
user tabs out of each element. However, I'm having some
problems.
It appears that the order of events is onChange followed
some time afterwards by onBlur. I believe this to be the
case because in my onChange script, if the validation fails,
I force focus back to the field element. However, the focus
still falls to the next field and not back to the field I tried to
force the focus to. So it seems to me that the browser is
actually tabbing out of the field only after the onChange
script runs.
Now, I can't just use onBlur because a part of my validation
is checking to make sure the field is not blank. So using
onBlur, when I tab out of a blank (or erroneous) field, it
creates an endless loop where to adjacent fields are triggering
their validation script when focus gets placed back to the
erroneous field.
So that brings me back to the onChange. Does anyone
know how I can keep focus on the erroneous field after
the onChange script fires? Because simply forcing focus
on the field doesn't seem to be working.

In general, I don't like it when the script moves my focus.
It's annoying and it's not going to guarantee correct input,
anyway, because if I type the same bad value twice, it has
not changed, so the onChange handler won't fire. That's not
enough reason to use onBlur, though because even if you work
around the looping problem, there are still too many things
that can cause a field to lose focus before the user is ready
to have the input validated. What it does mean is that you
should also validate onSubmit and, as always, on the server.

The following inserts a 1/10 second delay before setting the
focus back to the field that failed validation:
<html>
<head>
<title>demo</title>
<script type="text/javascript">
var globalTakeFocus=null;

function setFocus(ref) {
globalTakeFocus=ref;
setTimeout("globalTakeFocus.focus();globalTakeFocu s.select()",100);
}

function validateField(ref) {
if (ref.value != "ok") {
alert("Value must be \"ok\"");
setFocus(ref);
}
}
</script>
</head>
<body>
<form>
<input onchange="validateField(this)"><br>
<input onchange="validateField(this)"><br>
<input onchange="validateField(this)">
</form>
</body>
</html>

Jul 23 '05 #2

Similar topics

CSS / OnFocus / OnBlur Question

by: Rich Morey | last post by:

Hello, I have created a form and assigned each of the form elements to a class in a style sheet. I would like to know if it is possible to add 'OnFocus' and 'OnBlur' events to the style sheet...

HTML / CSS

Netscape7.1 order of onchange()/onsubmit() events WRONG

by: Lynn | last post by:

I have been going round in circles trying to get this to work..... I have a form with many fields, each with an onchange() event. There is also an onclick event on the form Submit button. If one...

Javascript

events get lost (from onBlur to onClick)

by: Heiko Vainsalu | last post by:

Hi Hope somebody knows how to solve this one. *The Situation* A traditional situation where HTML form inputs are checked... (if simplified then it would look something like this) <form...

Javascript

focus after onchange event and regex test not working

by: jab3 | last post by:

Hello. I"m new to this group, and to JavaScript in general, so please forgive me if I breach local etiquette. I'm trying to implement some client-side 'dynamic' validation on a form. I'm having...

Javascript

adding events to an input box at runtime

by: Robert Bravery | last post by:

HI all, I have a form for searches on a mysql database/table. The form has on input text box, and several pushbuttons. Depending on which pushbutton is selected, the search is then done on a...

Javascript

OnChange-OnBlur

by: niubee | last post by:

What exactly do they do - i'm completely green in programming.

Javascript

Memory Leak IE Javascript attribute add onblur

by: Joshua | last post by:

I'm running into an issue with a memory leak in an Asp.Net web page. In the code behind (.cs) I'm adding onchange, onblur and onfocus events to a bunch of objects that reside on my page...

C# / C Sharp

can a function change fields without having "onchange()" in field defintion?

by: TriAdmin | last post by:

I am working with a system that allow me to add custom fields but I can not add OnChange() language to the custom fields. So I want to have a function in the header that recognizes when fieldx is...

Javascript

native code attached to onblur/onfocus event handler

by: wolverine | last post by:

Hi All, In Mozilla Firefox, to onblur and onfocus event of each and every html element, the browser itself will attach a native event handler. I mean if you type,...

Javascript

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

Windows Server