Formulario y validacion de campos.

[Italico76]

Iniciado por PHPeros

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:

<!--
    Validar si los SELECT..OPTIONs tienen opciones seleccionadas
    es una implementacion de required
    
    Si hay una primera opcion del tipo "Seleccione su ciudad",etc
    debe llevar la clase 'ignored'
 
-->
 
<script>
/*
    @author Pablo Bozzolo
    @param null
    @return boolean 
*/
function selectRequiredValidate()
{
    selects = document.getElementsByTagName('SELECT');
    
    selected=0; 
    required_selects = 0;
    for (var k=0;k<selects.length;k++)
    {       
        sel = selects[k];
        if (sel.getAttribute('class')=='required')
        {
            required_selects++;
            this_selected=false;
            for (ix=0;ix<sel.length;ix++)       
            {               
                option = sel[ix];                                               
                    if ((option.selected) && (option.getAttribute('class')!='ignored'))
                        this_selected=true;
                        
            }   
            
            if (this_selected)  
                selected++;
        }                   
    }
    
    return (selected==required_selects);                
}   
 
</script>
 
    <input type="text" name="nombres" value="Juan" class="required"/><p/> 
 
    <select name="departamento[]" class="required" >
        <option value="" class="ignored">Selecciona depto</option"> 
        <option value="Bogota DC">Bogota DC</option"> 
        <option value="Antioquia">Antioquia</option"> 
        <option value="Caldas" selected>Caldas </option"> 
        <option value="Quindio" >Quindio</option">  
    </select> 
    
    <label>Inquietudes medio-ambientales:</label><p/>
    <!-- SELECT...OPTIONs -->   
    <select name="departamento[]" multiple class="required">
        <option value="" class="ignored">Selecciona</option"> 
        <option value="Hg" selected="selected">Mercurio en las aguas</option"> 
        <option value="CO2">Emision de CO2</option"> 
        <option value="deforestacion" selected="selected">Deforestacion</option"> 
        <option value="otras" selected="selected">Otras</option">   
    </select> 
    <p/>   
    
<script>    
    console.log(selectRequiredValidate());
</script>
 

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