has no properties

pedrule · #1 (**permalink**) 04/12/2008, 09:15

Hola soy nuevo en esto de javascripts: Tengo este codigo que funciona ok y es lo que busco:

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
	<title>Selects dependientes</title>
</head>

<body>
<form name="f1">
<select name=pais onchange="cambia_provincia()">
<option value="0" selected>Seleccione...
<option value="1">España
<option value="2">Argentina
<option value="3">Colombia
<option value="4">Francia

</select>

<select name=provincia>
<option value="-">-
</select>
</form>

<script>
//defino una serie de varibles Array para cada país
var provincias_1=new Array("-","Andalucía","Asturias","Baleares","Canarias","Castilla y León","Castilla-La Mancha","...")
var provincias_2=new Array("-","Salta","San Juan","San Luis","La Rioja","La Pampa","...")
var provincias_3=new Array("-","Cali","Santamarta","Medellin","Cartagena","...")
var provincias_4=new Array("-","Aisne","Creuse","Dordogne","Essonne","Gironde ","...")

//función que cambia las provincias del select de provincias en función del país que se haya escogido en el select de país.
function cambia_provincia(){
	//tomo el valor del select del pais elegido
	var pais
	pais = document.f1.pais[document.f1.pais.selectedIndex].value
	//miro a ver si el pais está definido
	if (pais != 0) {
		//si estaba definido, entonces coloco las opciones de la provincia correspondiente.
		//selecciono el array de provincia adecuado
		mis_provincias=eval("provincias_" + pais)
		//calculo el numero de provincias
		num_provincias = mis_provincias.length
		//marco el número de provincias en el select
		document.f1.provincia.length = num_provincias
		//para cada provincia del array, la introduzco en el select
		for(i=0;i<num_provincias;i++){
		   document.f1.provincia.options[i].value=mis_provincias[i]
		   document.f1.provincia.options[i].text=mis_provincias[i]
		}	
	}else{
		//si no había provincia seleccionada, elimino las provincias del select
		document.f1.provincia.length = 1
		//coloco un guión en la única opción que he dejado
		document.f1.provincia.options[0].value = "-"
	    document.f1.provincia.options[0].text = "-"
	}
	//marco como seleccionada la opción primera de provincia
	document.f1.provincia.options[0].selected = true
}
</script>
</body>
</html>

Bien aki dije guay esto es lo que busco pero que pasa que al insertarlo en mi codigo en el body en la consola de error de firefox:

Cita:

Error: document.f1.pais has no properties
Archivo de origen: file:///C:/Documents%20and%20Settings/Pedrule/Escritorio/Universidad%200809/Tecnologia%20Web/Practica%201%20-%20Fase2/index.jsp
Línea: 169

Pongo el codigo completo donde lo insertado:

Código HTML:

<html>
<head>
<title>¡QDP!</title>
<link href="./css/contenedores.css" rel="stylesheet" type="text/css" />
<link href="./css/decora.css" rel="stylesheet" type="text/css" />





</head>
<body>

<!-- AQUI VA LA CABECERA  -->
<div id="header">
<div id="h_izq">

</div>
<div id="h_der">

<div id="h_der_arr">
<h1><a href="#">¡Que de pisos!</a></h1>
</div>
<div id="h_der_aba">
<div id="menu">
		<!-- AQUI VA EL MENU DE DE NAVEGACION  -->	
		<ul>
			<li class=><a href="#" title="">¡Que de pisos!</a></li>
			<li><a href="#" title="">Portada</a></li>
			<li><a href="#" title="">Ayuda</a></li>
			
		</ul>
		</div>
</div>

</div>

		</div>

<!-- CONTENEDOR PRINCIPAL : PANEL DE BUSQUEDA,PANEL INFORMACION ;PIE-->
<div id="contenedor">
<!-- MENU DE IDENTIFICACION  -->
	<div id="c_arr">
	<div id="c_arr_izq">
	<h2 class="titulo1">Cuenta Cliente</h2>
			
				<form class="login" method="post" action="index2.jsp">
					<fieldset>
					<legend>Autenticacion:</legend>
					<div class="col">
					<label for="inputtext1">Identificador:</label>
					<input id="inputtext1" type="text" name="inputtext1" value="" />
					<label for="inputtext2">Clave:</label>
					<input id="inputtext2" type="password" name="inputtext2" value="" />
					<input id="inputsubmit1" type="submit" name="inputsubmit1" value="Enviar" />
					<a href="registro.jsp" title=""><input id="inputsubmit1" type="submit"  value="Registro" /></a>
					
					</div>
					</fieldset>
					<a href="admin.jsp" title="">admin</a>

					
				</form>


			</div>
	
	<div id="c_arr_der">
	<h2 class="titulo2">Buscar</h2>
				<form class="login" method="post" action="error.jsp" name="f1">
					<fieldset>
					<legend>Busqueda</legend>
					<div class="col">
					<label for="inputtext1">Localidad:</label>
					<select id="inputtext2" name="localidad" onchange="cambia_barrio()">
			<option value="0" selected>(Selecciona...) </option>
			<option value="1"> Madrid 
			<option value="2"> Barcelona </option>
			</option>
      </select>
	  <label for="inputtext2">Direccion:</label>
					<input id="inputtext2" type="password" name="inputtext2" value="" />
					
					</div>
					<div class="col">
					<label for="inputtext1">Barrio:</label>
					<select id="inputtext2" name=barrio>
					<option value="-">----- </option>
			
      </select>
					
					<label for="inputtext2">Mínimo Metros Cuadrados:</label>
					<select id="inputtext2" name="localidad">
					<option value="opcion0">(Selecciona...) </option>
					<option value="opcion1"> 30 </option>
					<option value="opcion2"> 40</option>
					<option value="opcion2"> 50</option>
					<option value="opcion2">70</option>
					<option value="opcion2">90</option>
			
      </select>
					</div>
					<div class="col">
					<label for="inputtext2">Precio Máximo (Euros):</label>
					<select id="inputtext2" name="localidad">
					<option value="opcion0">(Selecciona...) </option>
					<option value="opcion1"> 120000 </option>
					<option value="opcion2"> 180000 </option>
					<option value="opcion1"> 240000 </option>
					<option value="opcion2"> 300000 </option>
					<option value="opcion1"> 360000 </option>
					<option value="opcion2"> 420000 </option>
					<option value="opcion2"> 480000 </option>
					<option value="opcion2"> 540000 </option>
					<option value="opcion2"> 600000 </option>
			
      </select>
					<label for="inputtext2">Habitaciones:</label>
					<div id="col">
					 <input type="Radio" name="hab" value="una" checked>No definido
					 
					 </div>
					<div id="col">
					 <input type="Radio" name="hab" value="una">Una
					 <input type="Radio" name="hab" value="dos">Dos
					 
					 </div>
					 <div id="col">
					 <input type="Radio" name="hab" value="tres">Tres
					 <input type="Radio" name="hab" value="tres">Más de tres
					 </div>
					<input id="inputsubmit1" type="submit" name="inputsubmit1" value="Enviar" />
					</div>
					</fieldset>
				</form>
	
			</div>
	
	
			</div>
	<!-- PANEL BUSQUEDA -->
			<div id="c_aba">
			<!-- PANEL SALIDA INFORMACION DE USUARIO -->
			<h2 class="title">¡Bienvenido!</h2>
			<h3 <class="date"><span class="month">Nov.</span> <span class="day">8</span><span class="year">,2008</span></h3>
				<p>Estás en la web <b>¡QuedePisos! </b>.</p> 
				<p>Aquí encontrará el piso que busca.</p>
			</div>
				</div>




			


<script>
//defino una serie de varibles Array para cada país
var provincias_1=new Array("-","Andalucía","Asturias","Baleares","Canarias","Castilla y León","Castilla-La Mancha","...")
var provincias_2=new Array("-","Salta","San Juan","San Luis","La Rioja","La Pampa","...")
var provincias_3=new Array("-","Cali","Santamarta","Medellin","Cartagena","...")
var provincias_4=new Array("-","Aisne","Creuse","Dordogne","Essonne","Gironde ","...")

//función que cambia las provincias del select de provincias en función del país que se haya escogido en el select de país.
function cambia_provincia(){
	//tomo el valor del select del pais elegido
	var pais
	pais = document.f1.pais[document.f1.pais.selectedIndex].value
	//miro a ver si el pais está definido
	if (pais != 0) {
		//si estaba definido, entonces coloco las opciones de la provincia correspondiente.
		//selecciono el array de provincia adecuado
		mis_provincias=eval("provincias_" + pais)
		//calculo el numero de provincias
		num_provincias = mis_provincias.length
		//marco el número de provincias en el select
		document.f1.provincia.length = num_provincias
		//para cada provincia del array, la introduzco en el select
		for(i=0;i<num_provincias;i++){
		   document.f1.provincia.options[i].value=mis_provincias[i]
		   document.f1.provincia.options[i].text=mis_provincias[i]
		}	
	}else{
		//si no había provincia seleccionada, elimino las provincias del select
		document.f1.provincia.length = 1
		//coloco un guión en la única opción que he dejado
		document.f1.provincia.options[0].value = "-"
	    document.f1.provincia.options[0].text = "-"
	}
	//marco como seleccionada la opción primera de provincia
	document.f1.provincia.options[0].selected = true
}
</script>

<form name="f1">
<select name=pais onchange="cambia_provincia()">
<option value="0" selected>Seleccione...
<option value="1">España
<option value="2">Argentina
<option value="3">Colombia
<option value="4">Francia

</select>

<select name=provincia>
<option value="-">-
</select>
</form>
			
			
</body>
</html>

Esto es una prueba es que no entiendo porque no lo ve si alguien pudiera contarme algo mas sobre este error me vendria bien ¿por las capas es imposible no? ademas lo he puesto directamente en l body gracias.

#2 (**permalink**) 04/12/2008, 09:28

<form class="login" method="post" action="error.jsp" name="f1">
y más abajo...
<form name="f1">

No le pongas el mismo nombre a las cosas.

pedrule · #3 (**permalink**) 04/12/2008, 14:05

Gracias por tu tiempo y disculpa mi ignorancia ya va.