problem converting text to lower case

1

I have created a function that converts the text to lowercase inside the input, the problem and that when I inform an input with value, and having to change something the cursor jumps to the end. Does anyone know how to solve this?

My code:

// Converte minusculas em maiusculas
function up(lstr) {
    var str = lstr.value;
    lstr.value = str.toUpperCase();
}
<input OnKeyUp='up(this)' type='text' class='form_campos form_campos_simples' id='inputNormal' name='historico' value="TESTANDO O TEXTO">
    
asked by anonymous 23.02.2016 / 19:47

2 answers

2

No need to use function, so use direct input:

onkeyUP="this.value = this.value.toUpperCase()"

Using Ajax, you can edit anywhere in the field without skipping the cursor:

$(document).ready( function() {
  $("#NOME_DO_SEU_INPUT").on('input', function(){

    // armazena posição corrente
    var start = this.selectionStart,
        end = this.selectionEnd;

    this.value = this.value.toUpperCase();

    // restaura posição armazenada anteriormente.
    this.setSelectionRange(start, end);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><inputid="NOME_DO_SEU_INPUT" />

Adaptation from here

    
23.02.2016 / 20:04
1

Well, with Diego's help, the following solution has arrived:

$(document).ready( function() {
  $('input').on('input', function(){

    // Armazena posição corrente do cursor
    var start = this.selectionStart,
        end = this.selectionEnd;

    this.value = this.value.toUpperCase();

    // Restaura posição armazenada anteriormente.
    this.setSelectionRange(start, end);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><inputnome="campo1">
<input nome="campo2">
<input nome="campo3">
<input nome="campo4">
<input nome="campo5">
<input nome="campo6">
<input nome="campo7">

Thanks for the help.

    
25.02.2016 / 12:08