How can I convert TextBox multiline to Uppercase in Opera?

Question

I can't find how to convert TextBox multiline to Uppercase in Opera? I use "text-transform:uppercase" but it work only with IE

Answer 1

It looks like you found a bug in Opera because it works in IE 8 and Firefox 3.6. A possible solution is this javascript:

<script type="text/javascript">
    function setUpperCase(textarea) {
        textarea.value = textarea.value.toUpperCase();
    }
</script>
...
<textarea onkeyup="setUpperCase(this)"></textarea>

Answer 2

Hm. I think Opera disabled text-transform:upper-case on INPUT and TEXTAREA by default because a certain important insurance site by mistake styled their inputs as upper-case and people found it very frustrating and confusing to be typing in upper case only. :) (For that specific styling and at that time, Opera was the only browser obeying the text-transform instruction. Things may have changed.).

For usability, I would recommend that you transform to upper case on the server side or when the user is done typing (for example in the onchange event).

(Further, I'd expect CSS to only affect the way things are shown on screen. So even if you style a TEXTAREA with text-transform:upper-case and the text is shown in upper case when the user is typing, I'd expect the browser to send the text to the server in lower case if that's what the user typed.)