Dropdown list javascript focus issue

Posted on 2007-10-01
Last Modified: 2008-01-09
I have a dropdown list and a text box in a form in that order.  On the blur of the dropdown, I evaluate the contents (in javascript) and in a certian case pop up a message box and set the focus back to the dropdown to force the user to change the value.

My problem is, when there is text in the textbox the text gets highlighted when the blur of the dropdown occurs.  When I set the focus back to the dropdown (in script) the text in the textbox stays highlighted.  

I realize if the dropdown list was a textbox then I could use the  However, since it is a dropdown this function is not available.  I've tried everything I can think of with no avail... Any help would be MUCH appriciated!!!

Here is some sample code - this is not the actual code but you'll get the gist:

<script language="javascript">
   function EvaluateMe()
    if (document.getElementById("dropdown1").value == "A")
        window.alert("Invalid entry.");

<asp:dropdownlist id="dropdown1" runat=server onBlur="EvaluateMe()">
 <asp:ListItem text="A" value="A"></asp:ListItem>
 <asp:ListItem text="B" value="B"></asp:ListItem>

<asp:textbox id="textbox1" runat=server text="textbox text"></asp:textbox>
Question by:lokiette
    LVL 4

    Accepted Solution

    The only solution I can seem to make work is the following:

    On the blur of the text field next in line that can get focus by hitting tab.... I do an on blur and reset it's value effectivly canceling the highlight...

    <script language="javascript">
       function EvaluateMe(sel) { if (sel.selectedIndex == 1) {
            alert("Invalid entry.");
    <form name="a">
          <select name="dropdown1" onBlur="EvaluateMe(this);">
          <input type="text" name="d" value="asdadadsladnsadasd" onBlur="this.value = this.value;">

    Author Comment

    Wow, I never thought about that!  It definately works for a short term solution but I really need something not so hackish.  The fields on the form tend to change so I would have to add that onBlur to multiple fields, which seems a little crazy.  

    One solution I am considering is using the onChange vs. onBlur but I'm not sure this is the best solution for my application since then the script will only be called when the value changes vs every time the field loses focus.  I'm still looking for alternatives and would like to keep it confined to the one function.
    LVL 4

    Expert Comment

    There really isn't another way that I can come up with. There is no built in way to find out which element is currently selected. so another option would be to simply have an onFocus="currentObj=this;" in all your fields; which again is yes cheeky...

    I would recomend bagging the onBlur and either do it onChange or off of the submit/next button.
    LVL 1

    Expert Comment

    Forced accept.

    EE Admin

    Featured Post

    Highfive + Dolby Voice = No More Audio Complaints!

    Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

    Join & Write a Comment

    Both jQuery and Mootools offer some nice, easy to use scripts. Mootools is best known for their interactive slideshows and jQuery for their menus, but both have many other uses as well.   jQuery is basically a toolkit with many DOM (http://en.wik…
    JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
    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)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. 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…

    728 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

    Need Help in Real-Time?

    Connect with top rated Experts

    21 Experts available now in Live!

    Get 1:1 Help Now