viernes, 10 de febrero de 2017

validación campo numérico de 0 a 20 JavaScript

Validación de campo numérico en este ejemplo de 0 a 20 para notas del estudiante:



HTML:

En el lado de la vista trabajaremos con la etiqueta <input />


<input type="text" class="grade" maxLength="2"/>

se está declarando un input de tipo texto y la clase lleva como atributo "grade" ahora realizaremos la parte de la validación en javaScript usando jQuery.

JQUERY

 En jquery existe un evento keypress
 en el siguiente código se se está realizando las validaciones: 
 1. si el primer carácter es menor que 2 entonces puede presionar 0-9
 2. si el primer carácter es mayor o igual que 2 entonces puede presionar 0-0
 3. caso contrario puede presionar del 0 - 2
 4. al final retorna false o true
jQuery(".grade").keypress(function(e) {   
 var result;
  if($(this).val().length > 0 && ($(this).val()).charAt(0) < 2){//1
  result = validationNumber(e, 48, 57);
  }else if($(this).val().length > 0 && ($(this).val()).charAt(0) >= 2){//2
  result = validationNumber(e, 48, 48);
  }else{//3
  result = validationNumber(e, 48, 50);
  }
 return result;
});

JAVASCRIPT:

En la parte de JavaScript se realiza la función validationNumber() que recibe 3 parámetros:

function validationNumber(e, i, f){
    var keyCode = e.which ? e.which : e.keyCode;
    var ret = (keyCode >= i && keyCode <= f);
    return ret;
}

la siguiente función recibe el evento realizado por el usuario y obtiene el código del carácter presionado y valida que el código o keycode este dentro de los parámetros enviados.

Puedes ver:

1. Ejemplo de pagos con paypal código fuente en : http://cloudsrcsoft.com/Paypal/
2. Mostrar bloques con código HTML dentro de una página web: http://lawebdenoticiastecnologia.blogspot.com/2017/02/mostrar-bloques-con-codigo-html-dentro.html


0 comentarios:

Publicar un comentario