Ver Mensaje Individual
  #4 (permalink)  
Antiguo 08/06/2014, 09:15
Avatar de Italico76
Italico76
 
Fecha de Ingreso: abril-2007
Mensajes: 3.303
Antigüedad: 17 años, 7 meses
Puntos: 292
Respuesta: Formulario y validacion de campos.

Cita:
Iniciado por PHPeros Ver Mensaje
El select required no es soportado por ningún navegador
Que curiosidad

Aun mas curioso es el mal-diseño (creo yo) que hace que aun sino hay opcion seleccionada con selected o selected="selected" .. hace que el primer OPTION tenga la propiedad selected en true.

Con asqueroso parche de clase 'ignored' para la opcion por defecto del tipo "Seleccione su ciudad",etc

Código Javascript:
Ver original
  1. <!--
  2.     Validar si los SELECT..OPTIONs tienen opciones seleccionadas
  3.     es una implementacion de required
  4.    
  5.     Si hay una primera opcion del tipo "Seleccione su ciudad",etc
  6.     debe llevar la clase 'ignored'
  7.  
  8. -->
  9.  
  10. <script>
  11. /*
  12.     @author Pablo Bozzolo
  13.     @param null
  14.     @return boolean
  15. */
  16. function selectRequiredValidate()
  17. {
  18.     selects = document.getElementsByTagName('SELECT');
  19.    
  20.     selected=0;
  21.     required_selects = 0;
  22.     for (var k=0;k<selects.length;k++)
  23.     {      
  24.         sel = selects[k];
  25.         if (sel.getAttribute('class')=='required')
  26.         {
  27.             required_selects++;
  28.             this_selected=false;
  29.             for (ix=0;ix<sel.length;ix++)      
  30.             {              
  31.                 option = sel[ix];                                              
  32.                     if ((option.selected) && (option.getAttribute('class')!='ignored'))
  33.                         this_selected=true;
  34.                        
  35.             }  
  36.            
  37.             if (this_selected) 
  38.                 selected++;
  39.         }                  
  40.     }
  41.    
  42.     return (selected==required_selects);               
  43. }  
  44.  
  45. </script>
  46.  
  47.     <input type="text" name="nombres" value="Juan" class="required"/><p/>
  48.  
  49.     <select name="departamento[]" class="required" >
  50.         <option value="" class="ignored">Selecciona depto</option">
  51.         <option value="Bogota DC">Bogota DC</option">
  52.         <option value="Antioquia">Antioquia</option">
  53.         <option value="Caldas" selected>Caldas </option">
  54.         <option value="Quindio" >Quindio</option">  
  55.     </select>
  56.    
  57.     <label>Inquietudes medio-ambientales:</label><p/>
  58.     <!-- SELECT...OPTIONs -->  
  59.     <select name="departamento[]" multiple class="required">
  60.         <option value="" class="ignored">Selecciona</option">
  61.         <option value="Hg" selected="selected">Mercurio en las aguas</option">
  62.         <option value="CO2">Emision de CO2</option">
  63.         <option value="deforestacion" selected="selected">Deforestacion</option">
  64.         <option value="otras" selected="selected">Otras</option">  
  65.     </select>
  66.     <p/>  
  67.    
  68. <script>   
  69.     console.log(selectRequiredValidate());
  70. </script>

selectRequiredValidate() devuelve true/false dependiendo de si todos los SELECT..OPTIONS con clase required tienen ya las opciones en selected
__________________
Salu2!

Última edición por Italico76; 08/06/2014 a las 10:27