Ver Mensaje Individual
  #3 (permalink)  
Antiguo 29/04/2015, 12:29
Avatar de HackID1
HackID1
 
Fecha de Ingreso: febrero-2013
Ubicación: En Update
Mensajes: 492
Antigüedad: 11 años, 9 meses
Puntos: 17
Respuesta: Verificar Valor introducido con Datalist

Buenas PHPeros.

Gracias por responder tan pronto,, he intentado usar el código que me suministras en la web pero no me funciona o no se hacerlo funcionar, he seguido buscando otros códigos.

Encontré este pero tampoco válida correctamente en JScript.

(COPIAR EN UN NUEVO DOC HTML PARA PROBAR)

Código Javascript:
Ver original
  1. <form action='' method='POST' id='datos' name='datos'>
  2. <div id='input_dato'>
  3. <label for='dato'>Dato Requerido:</label>
  4. <input type='text' name='dato' id='dato' list='nombres' required oninput='verificar(this)'>
  5. <input type='submit' name='boton' id='boton'>
  6. <datalist id='nombres'>
  7.  
  8. <option value='LIGHT' class='nombre'/>
  9. <option value='VEGETA' class='nombre'/>
  10. <option value='IKKI' class='nombre'/>
  11. <option value='EDEN' class='nombre'/>
  12.  
  13. </datalist>
  14. </div>
  15. </form>
  16. <script>
  17.     //Esta función se encargará de realizar la validación de los datos
  18.     function verificar(input){
  19. //Primero guardamos en una variable temporal el valor del input que se desea validar
  20.      var valor=input.value;
  21. //Luego se verifica si el usuario intenta enviar el campo vacío
  22.      if(valor.length==0){
  23. //Si el campo está vacío modificamos el mensaje que deseamos que muestre el navegador
  24. //Este paso es opcional
  25.      input.setCustomValidity('Debe ingresar un nombre');
  26.      }else{
  27. //Si el campo no está vacío, procedemos a validar la información
  28. //Guardamos el valor de todos los datos presentes en el datalist en un arreglo temporal
  29. var cis=document.querySelectorAll('#input_datos .nombre');
  30. //Leemos cuantos elementos incluye el arreglo cis
  31.      var n=cis.length;
  32. //Esta es una variable temporal que se usará en el análisis del arreglo cis
  33.      var valorT;
  34. //Es una variable bandera que indicará si el datos suministrado está en la lista
  35.      var bandera=0;
  36. //Recorremos cis
  37.      for(var i=0;i<n;i++){
  38. //Guardamos el iésimo valor de cis en la variable temporal valorT
  39.      valorT=cis[i].value;
  40.      //Comparamos el valor suministrado con valorT
  41.      if(valor==valorT){
  42. //Si son iguales el valor de la bandera cambia a uno
  43.      bandera=1;
  44. //Interrumpimos el ciclo
  45. break;
  46.      }      
  47.  
  48.      }
  49. //Si la bandera es igual a uno el dato es válido y se podrá usar para cualquier función específica
  50.      if(bandera==1){
  51. //Con esta línea eliminamos la validación de este input
  52.      input.setCustomValidity('');
  53.      }else{
  54. //Si no se encontró el valor podemos "lanzar" un mensaje indicando el error
  55.      input.setCustomValidity(valor+' no existe en la lista sugerida');
  56.      }      
  57.  
  58.      }
  59.      
  60.     }
  61.     </script>

Cómo puedo hacer funcionar uno de los dos códigos, esto de los datalist jeje, lo tenía un poco perdido la verdad.


Gracias saludos
__________________
Puntuar +1 es buena forma de dar las gracias. :P
Your Time is limited, so don't waste it living someone else´s life.
Por: HackID1