César Aquino Maximiliano

Software Developer | Bombero Voluntario | Tech Instructor

Hacer que tus input solo reciban letras, números y/o espacios con javascript

Publicado el por César Aquino Maximiliano en la categoría Desarrollo web

expresiones regulares

Disculpen por cómo escribí el título, pero no tenía como explicarme. He encontrado unos códigos para que puedan validar tus input y así evitar que el usuario ingrese otros datos que no deben ingresar. Por ejemplo si tienes un campo para nombres no necesitas que se ingrese sólo números, solo letras, números y espacios. Otro ejemplo sería para los DNI, si será solo los 8 dígitos, no necesitarás mas que números (no me salgan con input[type=number] que se usa para otra cosa).

Bien, aquí les dejo los códigos para cada una de las validaciones que deseas:

Solo texto y espacios

$("input.nombre").bind('keypress', function(event) {
  var regex = new RegExp("^[a-zA-Z ]+$");
  var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
  if (!regex.test(key)) {
    event.preventDefault();
    return false;
  }
});

Solo números

$("input.dni").bind('keypress', function(event) {
  var regex = new RegExp("^[0-9]+$");
  var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
  if (!regex.test(key)) {
    event.preventDefault();
    return false;
  }
});

Alphanumérico y espacios

$("input.buscar").bind('keypress', function(event) {
  var regex = new RegExp("^[a-zA-Z0-9 ]+$");
  var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
  if (!regex.test(key)) {
    event.preventDefault();
    return false;
 }
});

Cualquier duda me la hacen saber.

EXTRA: Estamos usando expresiones regulares para hacer los filtros.

Etiquetas:   ,