Formulario y validacion de campos.

[eltron]

Hola, estoy creando un pequeño formulario y tengo dos problemas que no soy capaz de resolver.

Primero os dejo el codigo: [URL="http://codepen.io/anon/pen/KxEpy"]http://codepen.io/anon/pen/KxEpy[/URL]

Ahora os comento, primero quiero hacer que el campo "Apellidos" este desabilidado hasta que se ingrese el nombre. Y segundo no se por que el fomulario se salta el requerido del select. El JS del select no es mio lo encontre por internet hace tiempo.
Espero que puedan ayudarme gracias.

[PHPeros]

El select required no es soportado por ningún navegador

[eltron]

Iniciado por PHPeros

El select required no es soportado por [URL="http://www.w3schools.com/tags/att_select_required.asp"]ningún navegador[/URL]

Si creo un select normal sin aplicarle javascript si que me funciona.

[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

[eltron]

Buscando eencontre como hacer que el segundo input se habilite cuando se escribe en el primero.

http://codepen.io/anon/pen/vFBsn

Fuente: http://www.forosdelweb.com/f13/habilitar-campo-texto-si-otro-campo-texto-no-esta-vacio-1071231/