Question

When entering a value in Input Box then clicking on Select List (FF and Chrome), will get the focus on the select list not the Modal Dialog.

This does not happen in IE.

Any suggestions on how to prevent this behavior in FF and Chrome?

http://jsfiddle.net/r66tR/1/

Answer 1

Sounds like a browser peculiarity but I came up with a solution (kludge really) for you:

<input id="blurrer" />

<select>
    <option value="1">1</option>
    <option value="2">2</option>    
</select>

<div id="dialog" style="display: none;">
    Hi there!
</div>

Jquery:

jQuery("#dialog").dialog({
    autoOpen: false,
    modal: true,
    close: function(event, ui) {
       jQuery("select").removeAttr("size");
    }
});


jQuery("#blurrer").blur(function() {
   jQuery("select").attr("size", "1");
   jQuery("#dialog").dialog("open");
});

http://jsfiddle.net/r66tR/5/

Add, workaround that (sort of) works for Chrome:

http://jsfiddle.net/r66tR/7/