Error de validacion con SELECT

[nolose]

Hola a todos compañeros!!



Me trae de cabeza un problema con un SELECT que muestra un listado de países, os explico un poco.


Tengo un fichero denominado países.js que contiene el array con todos los países (pego un pedacito):
var state = new Array("ESPAÑA","Afganistan","Islas Gland","Albania","Alemania","Andorra","Angola","An guilla");



El select lo implemento utilizando este código:

Código HTML:

<select name="paises" id="h1" class="contenedor">
           <script type="text/javascript">
		for(var hi=0; hi<state.length; hi++)
			document.write("<option value=\""+state[hi]+"\">"+state[hi]+"</option>");
            </script>
</select> 

Hasta aquí todo perfecto, funciona de escándalo. El problema es que cuando voy a validar este código en el W3C, el código js anterior tiene errores por todas partes. ¿Conocéis alguna forma de que imprima el contenido del array de países.js sin errores en estándar transitional?.


Gracias!!

[Fernand0]

Tenes innerHTML y appendChild.. la mas simple es innerHTML, aunque es fea esteticamente :P

saludos

[nolose]

que hacen exactamente esas funciones??

[Fernand0]

Insertan nodos o contenido HTML dentro del codigo, por ejemplo...

Código Javascript:

var h=document.getElementById("h1");
for(var hi=0; hi<state.length; hi++)
   h.innerHTML+='<option value="'+state[hi]+'">'+state[hi]+'</option>";
 

[nolose]

he estado estos dias investigando sobre el codigo que me pasaste y la verdad es que funciona muy bien, he sustituido el codigo que me pasaste y he reducido el número de errores de 60 a sólo 16 !!.

Solo me sigue fallanado el dichoso state.length

He estado intentando localizarlo en google estos dias para no dar más la lata pero no lo encuentro :(

Sabes como debería de ponerlo??

Actualmente:

Código HTML:

<select name="paises" id="h1" class="contenedor">
           <script type="text/javascript">
        var h=document.getElementById("h1");
            for(var hi=0; hi<state.length; hi++)
        h.innerHTML+='<option value="'+state[hi]+'">'+state[hi]+'</option>';
           </script>
</select>
 

[Fernand0]

mostra donde definis state

[sublime_style]

Mira el codigo esta bien, yo en mi caso usaria appendchild en vez de innerHTML pero no deberia cambiarte mucho, el tema de innerHTML es que no es un estandar es propietario de microsoft.
Quizas eso te este dando problemas al validar.

Otra cosa que puedes hacer para evadir usar el for para iterar es usar each de Jquery si puedes y quieres usar el framework y de paso aprovechas las funcionalidades para insertar los elementos al dom

[nolose]

var state = new Array("ESPAÑA","Afganistan","Islas Gland","Albania","Alemania","Andorra","Angola","An guilla");

[Fernand0]

innerHTML anda, o sea, la funcion es independiente de la variable, si hay error de codigo es otra cosa.. no tiene nada que ver que le pongas o no una variable a innerHTML, asi como es appendChild o innerHTML, si el error esta en el codigo va a ser lo mismo, innerHTML no tendria porque tirarte error por mas que estes en IE o no(excepto si el navegador no te lo permite)..

estas verificando que el for se ejecute perfectamente?

[nolose]

Si, el for funciona muy bien porque me lista todos los paises sin problema y el funcionamiento es correcto,

El problema viene cuando intento validar 3WC en Transitional, que muestra los siguientes errores:

# Error Line 80, Column 50: character ";" not allowed in attribute specification list

for(var hi=0; hi<state.length; hi++)


# Error Line 80, Column 50: element "state.length" undefined

for(var hi=0; hi<state.length; hi++)



Imagino que el fallo se encuentra en la instrucción, state.length, que no es estándar y me obliga a utilizar el famoso innerHTML o algo similar... (no creo q sea el ; aunque marque eso )


Alguna idea¿??? gracias por todo!!

[Fernand0]

puede ser que el error este antes del for pero te lo este marcando ahi

[nolose]

¿podria ser por meter un <script> dentro del <select> ????

[Fernand0]

no, me referia a un codigo de js anterior, no se, no veo error

[nolose]

imposible... solo utilizo ese, tiene que haber algo mal en el hi<state.length;


Enfin seguire investigando... muchisimas gracias por tu ayuda!!! me han sido de muchisima utilidad tus consejos Fernando!

[Fernand0]

Código Javascript:

var state = new Array("ESPAÑA","Afganistan","Islas Gland","Albania","Alemania","Andorra","Angola","An guilla");
 
function fill()
{
    var h=document.getElementById("h1");
    for(var hi=0; hi<state.length; hi++)
    {
        var op=new Option(state[hi], state[hi]);
        document.f0rm.paises.options[hi]=op;
    }
}
 

Código HTML:

<form name="f0rm">
    <select name="paises" id="h1" class="contenedor">
    </select>
</form>
 

[nolose]

he probado a ponerlo asi y no me carga los nombres del array, ¿no abria que llamar al la funcion fill?

[Fernand0]

sip.. deberias....

[nolose]

perfecto!!!!! todo validado a la perfeccion!.

Muchisimas gracias Fernando, publicaré si me das tu permiso esto en un blog para que otros puedan servirse de tu ayuda jejeje.

Creo que es un magnifico aporte, me sacaste de un apuro! mil gracias!

[Fernand0]

si, no hay problema

saludos!

[nolose]

pense que seria una chorrada pero no es tan chorrada xD,

me sigue dando un error al cerrar el </select> (que dice que no se cierra) :$:$



Line 61, Column 26: end tag for "select" which is not finished

</select>


Creo que es por el option?

[nolose]

el new Option() lo valida correctamente el W3C??? esque tiene q ser eso el fallo :S:S:S


He probado a implementarlo en php... y va bien (mucho mas sencillo la verdad :$:$ pero claro... ya trabajariamos de parte de servidor y no buscamos eso)

[nolose]

ERROR LOCALIZADO!

No se puede dejar el SELECT vacio... hay que meterle un option,

si le meto uno vacio...

<select name="paises" id="h1" class="contenedor" >
<option value=""></option>
</select>



Así funciona (lo valida bien el W3C) pero creo que es una chapuza... ¿qué opinan?

[Fernand0]

que es una chapuza?

[nolose]

que el select lea los options del array de la funcion, y para que valide el W3C haya que poner un option vacio :S:S

[Fernand0]

se debe dar algun problema al tener un contenido NULL me imagino

saludos y suerte con eso