problema con select y funcion onclick

kalvinman · #1 (**permalink**) 23/04/2012, 10:30

Hola amigos, tengo un problema bien cursioso que aun no he podido resolver.

Veran tengo este select que llama una funcion llamada ajustarmapa() con la funcion onclick.

Código HTML:

Ver original<select class="select-form" name="idciudad" id="idciudad" style="width:257px;">
 
                <option onclick="ajustarmapa('7.079365', '-70.758369')" value="11">Arauca</option>
 
                <option onclick="ajustarmapa('', '')" value="13">Armenia</option>
 
                <option onclick="ajustarmapa('', '')" value="10">Barranquilla</option>
 
                <option onclick="ajustarmapa('4.5819005656199225', '-74.0643310546875')" value="1"selected="selected">Bogotá</option>
 
                <option onclick="ajustarmapa('7.0954416047696025', '-73.1085205078125')" value="17">Bucaramanga</option>
 
                <option onclick="ajustarmapa('', '')" value="8">Cali</option>
 
                <option onclick="ajustarmapa('', '')" value="12">Cesar</option>
 
                <option onclick="ajustarmapa('', '')" value="16">Ibague</option>
 
                <option onclick="ajustarmapa('6.162400921526595', '-75.60791015625')" value="4">Medellin</option>
 
                <option onclick="ajustarmapa('4.812351703074642', '-75.69005012512207')" value="22">Pereira</option>
 
                <option onclick="ajustarmapa('', '')" value="9">Santa Marta</option>
 
                <option onclick="ajustarmapa('', '')" value="20">Sucre</option>
 
                <option onclick="ajustarmapa('', '')" value="15">Tunja</option>
 
                <option onclick="ajustarmapa('', '')" value="14">Villavicencio</option>
 
              </select>

necesito que la funcion se llame con los dos parámetros que son diferentes para cada opción, pero no funciona, solo llama la función cuando coloco el onclick en el select, pero entonces no podría enviarle datos diferentes por cada opción.

La parte mas curiosa de todo es que hasta hace un par de semanas funcionaba bien y nada ha cambiado en el código.

De cualquier manera me gustaría que me dijeran como podría solucionar esto o hacer una funcion que me recoja los datos que necesito.

Dafonz · #2 (**permalink**) 23/04/2012, 10:57

Yo lo pondría en onChange del select por ejemplo:

Código Javascript:

Ver originalfunction funcionPrueba(ele){
            var valores = ele.options[ele.selectedIndex].value;
            alert(valores);
        }

Siendo que:

Código HTML:

Ver original<select onChange="funcionPrueba(this)">
    <option value="3"> Opción 1</option>
    <option value="4"> Opción 2</option>
</select>

Ya solo seria ingeniártelas para los 2 valores

emprear · #3 (**permalink**) 23/04/2012, 11:17

Lo dicho por @Dafonz, es la forma más adecuada, aunque te diría de hecerle un agregado, como primera opción pone un valor vacío, mejora la usabilidad del usuario en el evento onchange, si son más valores, podés pasarlos en el mismo value separados con un caracter que haga de limitador y usar é metodo split() de javascript, yo he usado | en el ejemplo

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>titulo</title> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
 
<script type="text/javascript">
//<![CDATA[
function funcionPrueba(ele){
            var valores = ele.options[ele.selectedIndex].value;
            if(valores != ""){
            alert(valores);
          }
        }
 
//]]>
</script>
 
</head>
<body>
<select onchange="funcionPrueba(this)">
<option value="">Seleccionar opción</option>
    <option value="3|8.1"> Opción 1</option>
    <option value="4|5.06"> Opción 2</option>
</select>
 
</body>
</html>

mirá este post
http://www.forosdelweb.com/f4/listas...8/#post4142850
que se trató algo similar

Saludos