Detect overflow of textbox

[babaganoush]

Any ideas on how to detect whether the value in a textbox exceeds the size of the textbox? Can't really use # of characters, because if someone enters iiiii...it will be visibly shorter than wwwww....

Basically I have a form with a textbox, and I want it either size a, or if text overflows, size b. I've tried overflow:visible, and it stretches automatically, but you still can't access the length, even if 100 characters are entered, this.size still returns original value (20).

Any ideas or workarounds would be much appreciated.

[snowieken]

Well, this is definately just a workaround, but you could set the font-family of the textbox to a monospaced font (Fixedsys, Courier, System are all fonts 99.9% of users have on their system). That way, you can use the length method of the entered string.

On the other hand, what is wrong with overflow:visible? Or do you need the size of the textbox for something else?

[glenngv]

You can detect the offset width of the textbox in pixels.

<input type="text" style="overflow:visible;" onblur="alert(this.offsetWidth)" />

[Trojanfan]

If you want the text box a certain size, you could use overflow:auto so that the text box will automatically become scrollable rather than expanding.

[babaganoush]

offsetWidth is exactly what I'm looking for. And thanks for your input snowieken, certainly an idea.