I need an onBlur event for  some kind of container to run a validation

Posted on 2007-11-30
Last Modified: 2013-11-19
I have two sets of  radio buttons in a div. One of the option from each is "protect with password".  If the user selected the "password" option in any of these sets, I want to call an onBlur (with the function to enter password) but only once when they leave the div event if possible.  The problem is that only form objects support onBlur event. I use ajax to update my db so I really don't want to call ajax every time someone clicks the radio buttons.
any help is much appreciated
Question by:JoeUS
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
LVL 54

Expert Comment

ID: 20384082

What do you mean leave the "div event"?  As you pointed out that element (and other non-form elements) does not have an onblur event.  The reason is it doesn't have a focus event either.  So how to you see firing this?  What interaction by the user on the page should trigger this?  We need to find something along those lines to have a chance at finding a "substitute" for the onblur event.

Let me know if you have any questions or need more information.


Author Comment

ID: 20384587
div event was a typo. Sorry for that.
What I am doing right now is I use check boxes and  check for change at onBlur for each of them. I call ajax if anything changed and also request password if there was none set yet. I also call a confirm for the password and if validation fails on them, then move focus back to the proper object accordingly. Now, focus works quite differently in FF than in IE. This is why I would like to call for password, validation and ajax after I am done with the radios or check boxes.
LVL 54

Expert Comment

ID: 20387072
I don't really understand what you mean.  What is the problem now and is it just browser related?

What needs focus?  When should that happen?  Keep in mind it should be related to an event or script.  You mentioned password, radios, etc but which element has focus and where should the focus go?  What works and when does it fail?  Maybe the explanation above just needs to be reworded or it might just be that it is soo late but it just seems unclear.

If I understand you right you may want to put focus back on some element.  If that is true then you will need a global variable to keep track of where the focus "was."  If I am right and you need script as an example then I can provide it.  This is just a guess though. :)

Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users


Author Comment

ID: 20421073
"If I understand you right you may want to put focus back on some element.  If that is true then you will need a global variable to keep track of where the focus "was.""

Yes it seems like I will need a global to track the focus, but not only to put focus back on some objects but to call some functions. What I want to do is to reduce the number of calls I make back to the server with updates (asynchronous). Ideally I would know, which object  I had the focus on onBlur and make the call accordingly. Unfortunately, I do not know how to track the focus effectively to tell, which object it was on or is explicitly.
LVL 54

Accepted Solution

b0lsc0tt earned 500 total points
ID: 20424616
I have reread the comments and info here but I just don't have details to make a specific suggestion for you.  All the things you mentioned in the last comment are just too general for me to know how to suggest you implement a "global" variable.

I can tell you what I mean by that and maybe that is enough.  In the section of your html where you have the script (hopefully the head part of your page) you would declare the variables.  They would not be in a function, etc so they will be "global" and last as long as the page is there.  A simple example of this would be ...

<script type="text/javascript">
var w = null;

That is one I have used for popup windows before.  I end up assigning the new window to w so I can later tell if it exists, is closed, etc.

If you need help using this idea then please provide info.  There is no "canned" way to do what you want and it needs to be "made" for your page and situation.  That doesn't mean it can't be done or the code is complex but just means there isn't one answer.  Let me know if you have a question about this or anything I have said.


Author Comment

ID: 20472119
Thank you b0lsc0tt

This short discussion did help me to figure out what to do about minimizing callbacks to the server. First of all, I decided to fire the ajax for (only) the db updates at on click for the radios and onblur for the other elements. I also use JS to take care of the object updates in the current html. I fire ajax when the objects were correctly updated, so to keep them in sink with the db. I also make sure that the objects are initiated and the values are being reloaded on page load. It does work and the user experience is great! No IE page refresh on every clicks and coughs.

Thanks again for the help
LVL 54

Expert Comment

ID: 20472657
Your welcome!  I'm glad I could help.  Thanks for the grade, the points and the fun question.


Featured Post


Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

615 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question