Dudas de Programacion » Scripting » jQuery

COMO PASAR VALORES DE UN FORMULARIO HTML A UNA FUNCION ANONIMA EN JQUERY

(2 posts)
  • Started 1 year ago by titiushko
  • Latest reply from lineadecodigo
  1. titiushko
    Member

    Hola… ¡¡necesito ayuda!!
    Estoy un poco perdido en esto, bueno les explico….
    Estoy haciendo una graficas con jQuery usando jquery-1.4.2.min.js y visualize.jQuery.js este último es un plugin en jQuery para hacer las graficas y en ese aspecto estoy más o menos bien porque solo hay que llamara a la función para que me genere una grafica a partir de una tabla
    Así lo hago:

    <html>
    	<head>
    		<title>grafico</title>
    		<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
    		<script type="text/javascript" src=" visualize.jQuery.js"></script>
    		<link rel="stylesheet" type="text/css" media="screen" href=" visualize.css" />
    		<link rel="stylesheet" type="text/css" media="screen" href=" basic.css" />
    		<link rel="stylesheet" type="text/css" media="screen" href=" visualize-dark.css" />
     
    <script type="text/javascript">
    			$(document).ready(function(){
    				var objeto = document.getElementById('opcion');
    				valor = objeto.value;
    				$('#mitabla').visualize({type:valor,width:400,height:400});
    				var cosa = $("div.visualize");
    				$("div.visualize").remove();
    				$("#nuevo").append(cosa);
    			});
    		</script>
    		<style>
    			div#nuevo{width:600px; margin-left:auto; margin-right:auto;}
    			/*table.porClase{display:none;}*/
    		</style>
    	</head>
    	<body>
    		<form>
    			<select id="opcion">
    				<option value="bar" onClick="function()">barra</option>
    				<option value="pie" onClick="function()">pastel</option>
    			</select>
    		</form>
    		<table id="mitabla" class="porClase">
    			<caption>prueba grafica</caption>
    			<thead>
    				<tr>
    					<td></td><th>VOTOS</th>
    				</tr>
    			</thead>
    			<tbody>
    				<tr><th>ARENA</th><td>150</td></tr>
    				<tr><th>FMLN</th><td>160</td></tr>
    				<tr><th>PCN</th><td>40</td></tr>
    				<tr><th>GANA</th><td>120</td></tr>
    			</tbody>
    		</table>
    		<div id="nuevo"></div>
    	</body>
    </html>

    Como ven, quiero que la grafica cambie de barra a pastel y viceversa con solo al hacer click a una de las opciones de la etiqueta selcet, quiero que esto sea dinámico sin ningún botón.
    Lo que he intentado hacer es capturar el valor que se selecciona en la opción por medio del id “opcion” que le he puesto a la etiqueta select, pero al parecer solo agarra el primer valor y me genera una grafica de barras, solo cambia a grafica de pastel cuando actualizo la pagina y no quiero que funcione así.
    Como se habran dado cuenta, nose mucho de javascript jeje, quicira que me ayudaran por favor

    Posted 1 year ago #


  2. lineadecodigo
    Member

    Buenas,

    Si pones el código...

    $("#opcion").change(function(){
      var str = $("#opcion option:selected").val();
      alert(str);
    });

    ... dentro del .ready() Te harña un alert del valor de la opción de combo seleccionada cada vez que cambies.

    A partir de ahí, ya es cosa tuya modificar el gráfico. ;-)

    Salu2,
    Linea de Código.
    http://lineadecodigo.com
    Posted 1 year ago #

Reply

You must log in to post.

1,070 posts in 437 topics over 40 months by 388 of 892 members. Latest: lalala, nijh1, jasu

Acerca de...

Dudas de Programación es una Web, dentro del proyecto aulambra.com que nace con la idea de propocionar un foro de consultas sobre diferentes temas de programación. Orientado a ayudar a los internautas hispano-hablantes en Internet.

Ir al Blog de Linea de Código

Otras Webs