How to fix focus/clickability of XUL textboxes?

Question

On a normal webpage <input type='text'/>, in Firefox, you can click anywhere on the element and the browser will "focus" on that element. On a XUL (Firefox extension) <textbox> element however, only clicking on the leftmost part edges of the textbox will focus it; clicking anywhere else on it does nothing.

I find this really annoying, especially given how input elements in Firefox work normally; I'd have better UI with a web page than with a browser extension! Does anyone know of a way to fix this behavior (I was thinking maybe I could do an onClick="function(){this.focus()}" kinad thing, but that seems so hacky so I was really hoping there was a better way ...)

Answer 1

I finally figured out a workaround, although I remain surprised that there isn't a less hacky way of solving this. If anyone has a "real" fix, I'll happily award the answer to them.

<textbox id="foo" onclick="focusFunction('foo')"/>

function focusFunction(id) {
  document.getElementById(id).focus("")
}

Answer 2

So ... this ones a little embarrassing, but I thought I should share how I finally solved the problem properly. As it turns out, XUL elements DO normally get focused on when click. The problem, as I discovered, was that if you put those elements inside of another element that they aren't supposed to be inside of, then they stop being focused properly. In my case I had *sigh* the following:

<groupbox align="start">
    <caption label="Test"/>
        <radiogroup>

wrapping all of the actual contents of my document (and I didn't even close them either; it was just a terrible un-noticed copy/paste error).

So, if you find yourself thinking you need the code in my first answer, check your XUL files first: the problem is probably your own code.