This is a migrated thread and some comments may be shown as answers.

How to make user entry in RadTextbox as uppercase?

5 Answers 1881 Views

Input

This is a migrated thread and some comments may be shown as answers.

5 Answers, 1 is accepted

answered on 05 May 2010, 08:30 AM

Hello Medac,

I found its working for me after I added the style that you tried. I even tried with different browsers (IE8, Firefox, Opera) and the found the typed letter in uppercase only. Is it happening for any specific browser, in your case?

I tried another workaround for setting the typed text to uppercase by attaching the 'OnKeyPress' event to RadTextBox. Here is the code that I tried.

ASPX:

    
            <telerik:RadTextBox ID="radtxtCarrierComments" MaxLength="50" Width="350px" runat="server"
 
                AutoPostBack="true" OnTextChanged="radtxtCarrierComments_TextChanged" Style="text-transform: uppercase;">
 
                <ClientEvents OnKeyPress="OnKeyPress" />
 
            </telerik:RadTextBox>

JavaScript:

    
            <script type="text/javascript">
 
                var textBox;
 
                var text = new String();
 
                function OnKeyPress(sender, args) {
 
                    textBox = sender;
 
                    text = args.get_keyCharacter();
 
                    text = sender.get_textBoxValue() + text.toUpperCase();
 
                    setTimeout("textBox.set_value(text);", 100);
 
                }
 
            </script>

I hope the suggestion helps,

Shinu.

answered on 10 May 2010, 08:32 AM

Hello Medac,

It is not clear whether you want the textbox value to only appear uppercase or to actually be uppercase. Check out the following example, which demonstrates both. The text-transform CSS style is used to make the textbox value appear uppercase, while the ValueChanging event is used to actually transform the value. No need to use keystroke events for that.

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Data" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<script runat="server">

protected void radtxtCarrierComments_TextChanged(object sender, EventArgs e)

{

Label1.Text = (sender as RadTextBox).Text;

}

</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<title>RadControls</title>

<style type="text/css">

.upper

{

text-transform:uppercase;

}

</style>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<telerik:RadTextBox ID="radtxtCarrierComments" runat="server" CssClass="upper" AutoPostBack="true"

OnTextChanged="radtxtCarrierComments_TextChanged">

<ClientEvents OnValueChanging="MyValueChanging" />

</telerik:RadTextBox>

<script type="text/javascript">

function MyValueChanging(sender, args)

{

args.set_newValue(args.get_newValue().toUpperCase());

}

</script>

<br /><br />

textbox value: <asp:Label ID="Label1" runat="server" />

</form>

</body>

</html>

All the best,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.