A coworker experienced a strange problem yesterday (10/15/2012) wherein she could not expand select boxes on one of our key administrative tools. This seemed odd, especially since I had no problems on any other computers. However, after Firefox updated for me, I was also suddenly unable to access the tools. Given that I rely heavily on jQuery and jQuery UI, which provide superb cross-browser support, I have not experienced a browser upgrade bug in quite some time. I did not want to upgrade the libraries, since that would likely cause other bigger issues, but I needed to fix it.
I am not sure which element was the offending factor, but here is what contributed:
- jQuery 1.5.1
- jQuery UI 1.6
- Firefox 16.0.1 on Windows 7
- Select boxes were inside of <li> tags that used both accordions and tabledrag
The hack/fix is quite stupid and should be unnecessary:
$('select').click(function(){
$(this).focus();
});
Basically, the workaround was to tell the browser that it should focus on the select box whenever it is clicked. It seems ridiculous. But it did the trick.