Link to home
Start Free TrialLog in
Avatar of Brian
BrianFlag for United States of America

asked on

Convert text to Uppercase in CSS using ASP.NET

Hello Experts,

I'm creating an ASP.NET Web Form. I would like to have all input by user to be converted to Uppercase which I have been able to do so far, but when the text gets added to the database it gets added however the user inputs it. In other words it's not getting inputed into the database as uppercase.

Is there anyway I can make sure that all data entered in the form is shown and uppercase and then when added to database it gets added as uppercase as well?
Avatar of Ishaan Rawat
Ishaan Rawat
Flag of India image

use text-transform: uppercase int the user input text style...
Hi  asp_net2,

Use the text-transform property to convert your text to upper case, to lower case, or you can use it to capitalize words within your html text.

    text-transform: none;
    text-transform: uppercase;
    text-transform: lowercase;
    text-transform: capitalize;
    text-transform: inherit;

for more details:

http://www.codertools.com/css_help_guide/css_text-transform.aspx
Avatar of Gary
text-transform only gives the appearance, it doesn't change the underlying data
So in your code behind you need to manipulate the data to Uppercase or use javascript to capitalize it at the client side.
ASKER CERTIFIED SOLUTION
Avatar of Jagadishwor Dulal
Jagadishwor Dulal
Flag of Nepal image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Hi...
You can also use jQuery as follows:

<script src="Scripts/jquery-1.3.2.js" type="text/javascript">
</script>
 <script type="text/javascript">
$(document).ready(function()
{
$("#txt").keydown(function(e)
{
 if (e.keyCode >= 65 & e.keyCode <= 90)
{
val1 = $("#txt").val(); $("#txt").val(val1 + String.fromCharCode(e.keyCode)); return false;
 }
 });
 });
</script>

OR
You can use css as follows:
Use a css style on the text box. Your css should be something like this:

.uppercase { text-transform: uppercase; }

<asp:TextBox ID="TextBox1" runat="server" Text="" CssClass="uppercase"></asp:TextBox>

You can also use this

onkeyup="this.value=this.value.toUpperCase();"  - is working

but

.uppercase { text-transform: uppercase; } is more user friendly