asked on

can't blur the focus on a <select> drop-down list

Hello-

I need to control the appearance of a disabled drop-down list, but I'm not having any luck creating the read-only effect. Here is the code I generate (via my asp.net 1.1 app), and at least in IE I can still change the selection:

<select name="job:rep" id="job_rep" onfocus="this.blur();">
            <option value="65">Adam Parrish</option>
            <option value="18">Alan Goldstein</option>
            <option value="22">Anna Dominguez</option>
            <option selected="selected" value="32">Greg White</option>
</select>

I have also tried the following, with the same result:

<select name="job:rep" id="job_rep" onfocus="javascript:this.blur();">
<select name="job:rep" id="job_rep" onfocus="function preventFocus(e) { this.blur(); }">

Thanks for any help-

Mike

ASKER CERTIFIED SOLUTION

DireOrbAnt

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ottenm

ASKER

Better, but a bit awkward. When I click on the drop-down, it starts to open and display the list, and then all of a sudden closes and moves the focus the the next element.

A fix though, so thanks!

ottenm

ASKER

Wups, you can still edit the drop down. If you double-click instead of single click, the second click catches the dropdown and then you can drag up/down through the list. When you let go, the control has the focus and the new value is selected.

Should I start a new thread with this since I already awarded the points?

DireOrbAnt

Why don't you use this:
<select name="job:rep" id="job_rep" DISABLED>

ottenm

ASKER

No control over the appearance (browser chooses foreground/background colors).

DireOrbAnt

<input type="text">
<select name="job:rep" id="job_rep" onfocus="document.getElementById('AfterSelect').focus()" onchange="this.selectedIndex = PreviouslySelectedItem">
<option value="65">Adam Parrish</option>
<option value="18">Alan Goldstein</option>
<option value="22">Anna Dominguez</option>
<option selected="selected" value="32">Greg White</option>
</select>
<input id="AfterSelect" type="text">

<SCRIPT TYPE="text/javascript">
var PreviouslySelectedItem = document.getElementById('job_rep').selectedIndex;
</SCRIPT>

Make sure the script block goes into a BODY onload.

ottenm

ASKER

I'll buy that! Thanks DireOrbAnt!

DireOrbAnt

Sold!

can't blur the focus on a &lt;select&gt; drop-down list

can't blur the focus on a <select> drop-down list