Aceptar letras y numeros en un input tipo texto

publicado por: user109363

Buen día, tengo este código que solo permite el uso de números.

$('input[name="39"]').bind('keypress', function(e){
        var keyCode = (e.which)?e.which:event.keyCode
        return !(keyCode>31 && (keyCode<48 || keyCode>57)); 
});

pero ahora necesito que acepte números y letras, es decir después de que pase cierto evento que el input regrese a la normalidad.

_x000D_

_x000D_

$('select#_38').on('change', function () {_x000D_
        var varToTest = $(this).val();_x000D_
        alert(varToTest)_x000D_
        if (varToTest == 'nit'){_x000D_
          $('input[name="39"]').bind('keypress', function(e) {_x000D_
  var keyCode = (e.which) ? e.which : event.keyCode_x000D_
  return !(keyCode > 31 && (keyCode < 48 || keyCode > 90) && (keyCode < 97 || keyCode > 122));_x000D_
});_x000D_
        }else{_x000D_
          $('input[name="39"]').bind('keypress', function(e){_x000D_
        var keyCode = (e.which)?e.which:event.keyCode_x000D_
        return !(keyCode>31 && (keyCode<48 || keyCode>57)); _x000D_
});_x000D_
        }_x000D_
});

_x000D_

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>_x000D_
_x000D_
<select name="38[]" id="_38" data-placeholder="Seleccionar" class="form-control">_x000D_
                        <option value="ced" selected="selected">Cédula de Ciudadanía</option>_x000D_
                    <option value="nit">NIT</option>_x000D_
                    <option value="pasa">Pasaporte</option>_x000D_
                    <option value="identi">Tarjeta de Identidad</option>_x000D_
                    <option value="extra">Cédula Extranjería</option>_x000D_
                </select>_x000D_
_x000D_
_x000D_
<input id="39" name="39" type="text">

_x000D_

_x000D_

_x000D_

No realiza correctamente el cambio, la idea es permitir letras y numeros cuando se selecciona NIT y cualquier otro solo numeros

solución

Solo debes agregar los códigos de los caracteres que deseas a la condición:

_x000D_

_x000D_

$('input[name="39"]').bind('keypress', function(e) {_x000D_
  var keyCode = (e.which) ? e.which : event.keyCode_x000D_
  return !(keyCode > 31 && (keyCode < 48 || keyCode > 90) && (keyCode < 97 || keyCode > 122));_x000D_
});

_x000D_

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>_x000D_
<input id="39" name="39" type="text">

_x000D_

_x000D_

_x000D_

Aplicado a tu código, lo que haria es declarar una variable global llamada nitSeleccionado y cuando cambie el valor del select utilizar esa variable como bandera que indique el cambio. Por el otro lado, en el input text solo verifico si el valor de la variable ya cambió.

_x000D_

_x000D_

var nitSeleccionado = false;_x000D_
_x000D_
$('select#_38').on('change', function() {_x000D_
  var varToTest = $(this).val();_x000D_
  alert(varToTest)_x000D_
  if (varToTest == 'nit') {_x000D_
    nitSeleccionado = true;_x000D_
  } else {_x000D_
    nitSeleccionado = false;_x000D_
  }_x000D_
});_x000D_
_x000D_
$('input[name="39"]').bind('keypress', function(e) {_x000D_
  var keyCode = (e.which) ? e.which : event.keyCode_x000D_
  if (nitSeleccionado) {_x000D_
  	return !(keyCode > 31 && (keyCode < 48 || keyCode > 90) && (keyCode < 97 || keyCode > 122));_x000D_
  } else {_x000D_
    return !(keyCode > 31 && (keyCode < 48 || keyCode > 57));_x000D_
  }_x000D_
});

_x000D_

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>_x000D_
<select name="38[]" id="_38" data-placeholder="Seleccionar" class="form-control">_x000D_
  <option value="ced" selected="selected">Cédula de Ciudadanía</option>_x000D_
  <option value="nit">NIT</option>_x000D_
  <option value="pasa">Pasaporte</option>_x000D_
  <option value="identi">Tarjeta de Identidad</option>_x000D_
  <option value="extra">Cédula Extranjería</option>_x000D_
</select>_x000D_
_x000D_
<input id="39" name="39" type="text">

_x000D_

_x000D_

_x000D_


Nota: Como ultimo dato, yo preferiria cambiar la validación del teclado para permitir el uso de la tecla delete, las flechas de dirección y y la tecla ctrl/cmd para mayor libertad en el uso del input. Tambien vaciar el input cada vez que el select cambia. Para compatibilidad con el telefono es necesario utilizar keydown en lugar de keypress:

_x000D_

_x000D_

var nitSeleccionado = false;_x000D_
_x000D_
$('select#_38').on('change', function() {_x000D_
  var varToTest = $(this).val();_x000D_
  alert(varToTest);_x000D_
  $('input[name="39"]').val("");_x000D_
  if (varToTest == 'nit') {_x000D_
    nitSeleccionado = true;_x000D_
  } else {_x000D_
    nitSeleccionado = false;_x000D_
  }_x000D_
});_x000D_
_x000D_
$('input[name="39"]').bind('keydown', function(e) {_x000D_
  var keyCode = (e.which) ? e.which : event.keyCode_x000D_
  if (nitSeleccionado) {_x000D_
  	return e.metaKey || // cmd/ctrl_x000D_
    e.which <= 0 || // arrow keys_x000D_
    e.which == 8 || // delete key_x000D_
    /[a-zA-Z0-9]/.test(String.fromCharCode(e.which)); // numbers_x000D_
  } else {_x000D_
    return e.metaKey || // cmd/ctrl_x000D_
    e.which <= 0 || // arrow keys_x000D_
    e.which == 8 || // delete key_x000D_
    /[0-9]/.test(String.fromCharCode(e.which)); // numbers_x000D_
  }_x000D_
});

_x000D_

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>_x000D_
<select name="38[]" id="_38" data-placeholder="Seleccionar" class="form-control">_x000D_
  <option value="ced" selected="selected">Cédula de Ciudadanía</option>_x000D_
  <option value="nit">NIT</option>_x000D_
  <option value="pasa">Pasaporte</option>_x000D_
  <option value="identi">Tarjeta de Identidad</option>_x000D_
  <option value="extra">Cédula Extranjería</option>_x000D_
</select>_x000D_
_x000D_
<input id="39" name="39" type="text">

_x000D_

_x000D_

_x000D_

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *