Converting all text fields to uppercase x OnChange

maxsen
maxsen used Ask the Experts™
on
Hi,

How can I convert all fields from a form
to uppercase ?
I insert this code snippet in every text field
but it simply doesn't work, unless there's only
one of them in the form...  I wonder why.
It's an ASP page.

<input type="text" name="sdes_destino" maxlength=40 size=40 value="<%=sdes_destino%>" OnChange="javascript:this.value=this.value.toUpperCase();">

Thanks
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
if you want the text converted on the client-side:

<input type="text" name="sdes_destino" maxlength=40 size=40 value="<%=sdes_destino%>" OnChange="javascript:doUpperCase(this.id);">

<script language=javascript>
<!--
  function doUpperCase(field)
  {
    var fldToConvert = eval('document.forms[0].' + field);
    var strToConvert = new String(fldToConvert.text);

    fldToConvert.text = strToConvert.toUpperCase;
  }
//-->
</script>
you could use the onBlur event too, if you wish ...

thomasdodds
The code you put in should work just fine. I just tried a simple example like the following, and it worked:

<input name="testInput1" value="This is some text" onchange="this.value=this.value.toUpperCase();">

****************************************************

<form name="TestForm">
     <input name="testInput1" value="This is some text" onchange="this.value=this.value.toUpperCase();"><br />
     <input name="testInput2" value="This is some text" onchange="this.value=this.value.toUpperCase();"><br />
     <input name="testInput3" value="This is some text" onchange="this.value=this.value.toUpperCase();"><br />
     <input name="testInput4" value="This is some text" onchange="this.value=this.value.toUpperCase();"><br />
     <input name="testInput5" value="This is some text" onchange="this.value=this.value.toUpperCase();"><br />
</form>

*********************************************************

Of course the problem might be ther triggering. This will only trigger the input to change case if the value is changed to something. And onblur will only work if the user clicks on the input.

Since yours look very similar to this, I don't see the problem. UNLESS, you have 2 inputs with the same name. This will cause JavaScript to ignore the command.

********************************************************

If you are going to create a function to do the uppercasing (as I would suggest), do not use the "eval" function as it is costly and unneccesary. Nor should you use the ID as it is not always compatible. Do it like this:

<input type="text" name="sdes_destino" maxlength=40 size=40 value="<%=sdes_destino%>" onchange="doUpperCase(this);">

<script language=javascript>
<!--
 function doUpperCase(fieldObj)
 { fieldObj.value=fieldObj.value.toUpperCase(); }
//-->
</script>
Ensure you’re charging the right price for your IT

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

TallerMike,

You make an excellent point ... thanks for 'cleaning it up'.  

also, i just noticed that I used .text which should be .value when referring to the textbox.

thanks again

thomasdodds

Commented:
or if you want it to automatically displayed all uppercase you could simply,

<input type="text" name="sdes_destino" maxlength=40 size=40 value="<%=UCase(sdes_destino)%>">

Author

Commented:
Yes, it worked just as I needed.
Thanks a lot.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial