2

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.

$('select#_38').on('change', function () {
        var varToTest = $(this).val();
        alert(varToTest)
        if (varToTest == 'nit'){
          $('input[name="39"]').bind('keypress', function(e) {
  var keyCode = (e.which) ? e.which : event.keyCode
  return !(keyCode > 31 && (keyCode < 48 || keyCode > 90) && (keyCode < 97 || keyCode > 122));
});
        }else{
          $('input[name="39"]').bind('keypress', function(e){
        var keyCode = (e.which)?e.which:event.keyCode
        return !(keyCode>31 && (keyCode<48 || keyCode>57)); 
});
        }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select name="38[]" id="_38" data-placeholder="Seleccionar" class="form-control">
                        <option value="ced" selected="selected">Cédula de Ciudadanía</option>
                    <option value="nit">NIT</option>
                    <option value="pasa">Pasaporte</option>
                    <option value="identi">Tarjeta de Identidad</option>
                    <option value="extra">Cédula Extranjería</option>
                </select>


<input id="39" name="39" type="text">

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

2
  • Necesitas jquery? Porque podrías usar un pattern para el input text
    – Carmen
    Commented el 3 dic. 2018 a las 22:25
  • Gracias @Carmen por responder, si es necesario jquery ya que no tengo acceso directo al input, en realidad necesito que el imput acepte numeros y el signo -
    – user109363
    Commented el 3 dic. 2018 a las 22:33

1 respuesta 1

6

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

$('input[name="39"]').bind('keypress', function(e) {
  var keyCode = (e.which) ? e.which : event.keyCode
  return !(keyCode > 31 && (keyCode < 48 || keyCode > 90) && (keyCode < 97 || keyCode > 122));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="39" name="39" type="text">

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ó.

var nitSeleccionado = false;

$('select#_38').on('change', function() {
  var varToTest = $(this).val();
  alert(varToTest)
  if (varToTest == 'nit') {
    nitSeleccionado = true;
  } else {
    nitSeleccionado = false;
  }
});

$('input[name="39"]').bind('keypress', function(e) {
  var keyCode = (e.which) ? e.which : event.keyCode
  if (nitSeleccionado) {
  	return !(keyCode > 31 && (keyCode < 48 || keyCode > 90) && (keyCode < 97 || keyCode > 122));
  } else {
    return !(keyCode > 31 && (keyCode < 48 || keyCode > 57));
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="38[]" id="_38" data-placeholder="Seleccionar" class="form-control">
  <option value="ced" selected="selected">Cédula de Ciudadanía</option>
  <option value="nit">NIT</option>
  <option value="pasa">Pasaporte</option>
  <option value="identi">Tarjeta de Identidad</option>
  <option value="extra">Cédula Extranjería</option>
</select>

<input id="39" name="39" type="text">


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:

var nitSeleccionado = false;

$('select#_38').on('change', function() {
  var varToTest = $(this).val();
  alert(varToTest);
  $('input[name="39"]').val("");
  if (varToTest == 'nit') {
    nitSeleccionado = true;
  } else {
    nitSeleccionado = false;
  }
});

$('input[name="39"]').bind('keydown', function(e) {
  var keyCode = (e.which) ? e.which : event.keyCode
  if (nitSeleccionado) {
  	return e.metaKey || // cmd/ctrl
    e.which <= 0 || // arrow keys
    e.which == 8 || // delete key
    /[a-zA-Z0-9]/.test(String.fromCharCode(e.which)); // numbers
  } else {
    return e.metaKey || // cmd/ctrl
    e.which <= 0 || // arrow keys
    e.which == 8 || // delete key
    /[0-9]/.test(String.fromCharCode(e.which)); // numbers
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="38[]" id="_38" data-placeholder="Seleccionar" class="form-control">
  <option value="ced" selected="selected">Cédula de Ciudadanía</option>
  <option value="nit">NIT</option>
  <option value="pasa">Pasaporte</option>
  <option value="identi">Tarjeta de Identidad</option>
  <option value="extra">Cédula Extranjería</option>
</select>

<input id="39" name="39" type="text">

9
  • Hola Gracias por Responder, te comento lo que estoy tratando de realizar es esto [jsbin.com/yuzogocicu/2/edit?html,js,output] sin embargo no funciona
    – user109363
    Commented el 4 dic. 2018 a las 15:41
  • ¿la respuesta resolvió tu duda?
    – Rene Limon
    Commented el 4 dic. 2018 a las 15:42
  • aqui en Stack overflow tambien hay fiddles para hacer códigos ejecutables, por favor edita la pregunta y añade ese código explicando más a detalle el problema para que lo podamos resolver.
    – Rene Limon
    Commented el 4 dic. 2018 a las 15:51
  • Gracias amigo, tu respuesta ha sido clara y me ha funcionado, Un saludo
    – user109363
    Commented el 4 dic. 2018 a las 19:12
  • Hola, te comento el código no me funciona desde mi teléfono, que habría que realizar en ese caso
    – user109363
    Commented el 4 dic. 2018 a las 19:55

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.