how to control or change all the text to upper case

Question

I'm developing a few forms for my company to use. I consult and insert data into the database, but for standard issues I want to transform the text I enter to uppercase, How I do that?

Example of one of my forms:

I want the text fields I enter in automatically transformed to uppercase, or the data that I enter into my database already transformed to uppercase (in the case that the user doesn't enter it that way).

EDIT:

I try

$("tbCiudad").change(function() {
    $(this).val($(this).val().toUpperCase());
});

or

$("tbCiudad").keyup(function() {
    $(this).val($(this).val().toUpperCase());
});

and nothing happens to that field. What am I doing wrong?

Refer this [How can I force input to uppercase in an ASP.NET textbox?](http://stackoverflow.com/a/202545/500725) — Siva Charan, Mar 06 '12 at 16:19
there is no such element in html: `tbCiudad`. you should use `input[type=text]` for any text input or a more specific selector like a class or ID — Marius Ilie, Mar 06 '12 at 17:05

Marius Ilie · Accepted Answer · 2012-03-06T16:45:51.837

28

$("input[type=text]").keyup(function(){
  $(this).val( $(this).val().toUpperCase() );
});

edited Mar 06 '12 at 16:45

answered Mar 06 '12 at 16:18

Marius Ilie

3,283
2
25
27

this do something if i entered numbers? or if alredy enter the text in uppercase? – Alejandro Hinestrosa Mar 06 '12 at 16:31
i try it but doesn't happen anything – Alejandro Hinestrosa Mar 06 '12 at 16:37
that's weird. it should work just fine, unless you have some other javascript errors on your page. See [here](http://jsfiddle.net/cpF7C/) an live example of this – Marius Ilie Mar 06 '12 at 16:50
works perfectly fine man, thanks, i change something before, and i shouldn't change it – Alejandro Hinestrosa Mar 06 '12 at 17:14
To avoid the bad refresh effect of change the value to upper case, can use CSS (text-transform:uppercase). And to allow use selection and other special keys correctly, can put the following code: $("input[type=text]").keyup(function(e){ if (e.which >= 65) { $(this).val( $(this).val().toUpperCase() ); } }); [example](http://jsfiddle.net/hzhh6/25/) – Marc Apr 11 '13 at 09:55
This only works right if the cursor is at the end of the text. If you try to insert something, it forces the character to the end. – BobRodes Jul 01 '16 at 05:44

score 5 · Answer 2 · answered Mar 06 '12 at 16:19

You can add an event handler with javascript (or jquery if you want) to keypress or blur events of those textboxes and then apply what Jay Blanchard suggested. Something like this:

$("input[type='text']").bind("blur", null, function(e) {
    $(this).val($(this).val().toUpperCase());
});

score 2 · Answer 3 · answered Mar 06 '12 at 16:15

2

Using plain old JavaScript use toUpperCase()

answered Mar 06 '12 at 16:15

Jay Blanchard

34,243
16
77
119

$("#codigoCliente").toUpperCase() , something like this? – Alejandro Hinestrosa Mar 06 '12 at 16:18
if i entered numbers change something?, how i control the text i entered? if isn't uppercase transform it, and if is uppercase text doesn't do anything – Alejandro Hinestrosa Mar 06 '12 at 16:22
numbers won't be affected, if it's already uppercase, it'll still run the transformation, but nothing will actually be changed. – Anthony Shaw Mar 06 '12 at 16:30

score 1 · Answer 4 · answered Jan 01 '13 at 06:08

1

Use this Function

<script type="text/javascript" language="javascript">
      $(document).ready(function(){
        $("#text_field_id").keyup(function() {
        $(this).val($(this).val().toUpperCase());
        });
        });
</script>

answered Jan 01 '13 at 06:08

V A S

3,338
4
33
39

score 1 · Answer 5 · edited Jul 22 '12 at 06:29

1

You can use the javacsript method toUpperCase() for this conversion.

edited Jul 22 '12 at 06:29

Conner

30,144
8
52
73

answered Mar 06 '12 at 16:18

Kamran Ali

5,904
2
26
36

score 1 · Answer 6 · answered Mar 06 '12 at 16:22

1

Do you want to save it or only show it in UPPERCASE?

If you need only to show, you can you CSS:

<style type="text/css">
input {
    text-transform:uppercase;
}
</style>

If you want to save it in uppercase, the server-side is the best way to do it. I suggest creating a custom ModelBinder that would call String.ToUpper on every string property.

You can also mix both of this strategies.

answered Mar 06 '12 at 16:22

goenning

6,514
1
35
42

1

This doesnt Store in Uppercase – Ravi Mehta Apr 07 '16 at 08:36
1

That's why I said `If you need only to show, you can you CSS` – goenning Apr 07 '16 at 20:34

score 0 · Answer 7 · answered Mar 06 '12 at 16:16

0

Use javascript toUpperCase method.

I am also sure there is a function in ASP to do that such as strtoupper in PHP

answered Mar 06 '12 at 16:16

ade19

1,150
4
13
28

score 0 · Answer 8 · answered Mar 06 '12 at 16:21

0

Just apply CSS class to all required fields:-

.uppercase
{
    text-transform: uppercase;
}

Refer CSS text-transform Property

answered Mar 06 '12 at 16:21

Siva Charan

17,940
9
60
95

how to control or change all the text to upper case

8 Answers8