Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Ayuda para capturar valor de un select

Estas en el tema de Ayuda para capturar valor de un select en el foro de Frameworks JS en Foros del Web. Hola a todos,amigos tengo un problemas que ya hace dias me a dado dolores de cabeza: Bueno les cuento mi problema: Tengo 2 select en ...
  #1 (permalink)  
Antiguo 16/10/2010, 21:38
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Exclamación Ayuda para capturar valor de un select

Hola a todos,amigos tengo un problemas que ya hace dias me a dado dolores de cabeza:
Bueno les cuento mi problema:

Tengo 2 select en un formulario(los select, no son dinamicos cada uno trabaja por su lado),tambien puede ser importante les comente que los select los lleno de una base de datos mysql.
resulta que deceo que cuando eliga el primer select, poder capturar ese id escogido y pasarselo a una consulta SQL, para llenar unos tex-box, con los datos asociados al id escogido, y asi mismo con el otro.

Bueno logre hacerlo con php, pero obligatoriamente me refresca la pagina, y leyendo mucho supe que ajax, tiene la propiedad, de manejar eventos, sin refrescar la pagina. ¿ALGUIEN SABE COMO HACERLO, CUALQUIER ORIENTACION ME SIRVE?.

les pongo el codigo de mis select:

<select name="id_cliente" onChange="location.href='esta_misma_ pagina.php?id_cliente='+this.value; ">
<option value="" selected="selected">[Seleccione]</option>

/* AKA HAGO LA PETICION DE QUE LLENE EL SELECT */

<? $SQLQuery=mysql_query("select ID_CLIENTE,DE_NOMBRE from cliente order by DE_NOMBRE asc",$cn);

while ($Registro=mysql_fetch_array($SQLQuery))
{ ?>
<option value="<? echo $Registro['ID_CLIENTE']?>" <? if ($id_cliente==$Registro['ID_CLIENTE']) { echo 'selected'; } ?>>

<? echo htmlentities($Registro['DE_NOMBRE'])?></option>
<? } ?>
</select>


/* osea esto lo hace bien, el punto que en evento onchange refresca la pagina y ya pierdo los datos del otro select,, como lo hago......

Quedo atenta a ustedes,,,,, sorry soy novatilla en el mundo de la programacion
  #2 (permalink)  
Antiguo 17/10/2010, 19:37
Avatar de chicohot20  
Fecha de Ingreso: mayo-2009
Mensajes: 388
Antigüedad: 15 años
Puntos: 43
Respuesta: Ayuda para capturar valor de un select

Primero necesitas conseguirte la libreria jquery,esmuy buena.

Aca te dejo un ejemplo de la funcion ajax de Jquery,en el cual envìa todo los parametros de data(idcliente=xxx) a la url (pagina.php) y la respuesta la recibo en la opcion success.
Código Javascript:
Ver original
  1. <script type="text/javascript" src="jquery.js"></script>
  2. <script type="text/javascript">
  3.     function ajax(value){
  4.     var html="";
  5.     $.ajax({
  6.       url: "pagina.php",
  7.       contentType:"application/x-www-form-urlencoded; charset=utf-8",
  8.       type:"GET",
  9.       data: "idcliente="+value,
  10.       error: function(){
  11.        alert('Error');
  12.       },
  13.       success: function(data){
  14.         //Aca recibo la respuesta de pagina.php
  15.         //POr ejemplo
  16.         document.form.input.value=data;
  17.        }
  18.     });
  19.     }
  20. </script>
Este es el HTML,aunque con jquery tambien puedes manipular los eventos del select.
Código HTML:
Ver original
  1. <select onchange="ajax(this.value)">
  2.  <option>Option 1</option>
  3.  <option>Option 2</option>
  #3 (permalink)  
Antiguo 19/10/2010, 06:21
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Exclamación Respuesta: Ayuda para capturar valor de un select

Hola que tal, muchas gracias por responder, entiendo tu ejemplo y te agradesco mucho solo tengo dos consultas:

#
success: function(data){
#
//Aca recibo la respuesta de pagina.php
#
//POr ejemplo
#
document.form.input.value=data;


esta funcion, le esta dondo el foco a donde dirijo el id del cliente, por que en la url, ya lo esta enviando a la pagina, lo cual lo puedo capturar sin problemas...? funcionaria si lo envio a la pagina solamente, sin esta funcion..?

otra pregunta puedo enviar mas de un parametro en la funcion ej: el id del cliente y otros id...?

Y la ultima pregunta,, me dijiste que tenia que tener la libreria jquery,, es obligacion, ya que me parece que el codigo es solo ajax, pero veo que le haces referencia en el principio del codigo.....?

Bueno quedo a la espera de tu orientacion....

Muchas Gracias.-
  #4 (permalink)  
Antiguo 19/10/2010, 10:22
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Respuesta: Ayuda para capturar valor de un select

comunidad: trate de hacer esto pero no resulta:

//AKA EN EL ARCHIVO EXTERNO .JS, **no le coloco las etiquetas <script></script>, ya que esta en un archivo .JS
function ajax(value){
var html="";

$.ajax({

url: "KG_arriendo_I0.php",

contentType:"application/x-www-form-urlencoded; charset=utf-8",

type:"GET",

data: "id_obra="+value,

error: function(){

alert('Error');

},

success: function(data){

document.forms['FormActuliza'].value=data; // aca esta el nombre del formulario

}

});

}

//AKA MI PAGINA PHP...... Como le paso el id selecionado a una consulta SQL, para traerme los datos asociados a ese id..?????????????????????????

<script language="JavaScript" type="text/javascript" src="../jquery-1.4.3.min.js"></script>// esto es en la cabezera de mi pagina.php


<select name="id_obra" id="id_obra" onchange="ajax(this.value)" >

<option value="" >[Seleccione]</option>

//AKA MI CONSULTA SQL, PARA QUE LLENE EL SELECT

<?php echo htmlentities($RegObra['DE_NOMBRE'])?></option>

<?php } ?></select>

** Como le envio el id a la pagina.php de mi select,....?
** Es posible capturar varios id, al mismo tiempo,,,...?

Agradecida.-
-----------------------------

Última edición por PrincesaWeb; 19/10/2010 a las 10:27
  #5 (permalink)  
Antiguo 19/10/2010, 13:59
Avatar de chicohot20  
Fecha de Ingreso: mayo-2009
Mensajes: 388
Antigüedad: 15 años
Puntos: 43
Respuesta: Ayuda para capturar valor de un select

Hola.
Te respondo:

-La libreria Jquery es obligatorio, si no deja de funcionar la función $.ajax.
-Sí se puede enviar varios parametros mediante $.ajax Ejm: idcliente=1234&nombre=Luis&apellido=Perez

Te sugiero que trabajes con estos archivos:

- formulario.php // En esta pagina colocas tus formularios
- respuesta.php //archivo que responda tus peticiones AJAX

en formulario.php tengo lo siguiente:


Código PHP:
Ver original
  1. <script type="text/javascript" src="jquery.js"></script>
  2. <script type="text/javascript">
  3.     function ajax(value){
  4.     var html="";
  5.     $.ajax({
  6.       url: "respuesta.php",
  7.       contentType:"application/x-www-form-urlencoded; charset=utf-8",
  8.       type:"GET",
  9.       data: "idcliente="+value,
  10.       error: function(){
  11.        alert('Error');
  12.       },
  13.       success: function(data){
  14.         //Aca recibo la respuesta de respuesta.php
  15.         document.formulario.campo.value=data;
  16.        }
  17.     });
  18.     }
  19. </script>
  20. <form name="formulario">
  21. <input type="text" name="campo" />
  22. <select onchange="ajax(this.value)">
  23.  <option>Option 1</option>
  24.  <option>Option 2</option>
  25. </select>
  26. </form>

Y este es repuesta.php

Código PHP:
Ver original
  1. //aca capturas los parametros enviados desde AJAX, en este caso IDCLIENTE
  2. //Haces tu consulta SQL, por ejemplo quieres obtener el nombre del cliente
  3. $nombre="Luis"
  4. echo $nombre;
  5. //Lo que imprima respuesta.php será recibido en la opcion SUCCESS del ajax, es decir data tendra el valor "Luis" y por consiguiente en la caja de texto CAMPO se mostrará "Luis"

Espero que lo haya explicado bien. Disculpa pero de PHP sé poco, casi nada.
  #6 (permalink)  
Antiguo 20/10/2010, 07:19
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Exclamación Respuesta: Ayuda para capturar valor de un select

Hola Gracias por responder, la verdad me ha servido mucho tu orientacion,
y te cuento una buena y una mala jjejeje:

La buena, que funciono como diste el ejemplo, y hace exactamente lo que quiero, sin refrescar la pantalla... hasta ahi exelente.

La mala: recuerdas te comente si se podian pasar mas de un parametro, y me respondiste que si, ok, a raiz de eso estoy solicitando 4 parametros:
*de_numero,*de_telefono,*de_fax,*de_direccion

y los imprime sin problemas en las cajas de texto, el problema es que imprime estos 4 parametros en cada caja, y es uno por cada caja,

te dejo el codigo:

//En el formulario
<script language="JavaScript" type="text/javascript"src="query-1.4.2.min.js"></script>
<script language="JavaScript" type="text/javascript">

function ajax(value){
var html="";

$.ajax({
url: "respuesta.php",
contentType:"application/x-www-form-urlencoded; charset=utf-8",
type:"GET",
data: "id_obra="+value,
error: function(){
alert('Error');
},
success: function(data){
document.FormData.de_numero.value=data;
document.FormData.de_telefono.value=data;
document.FormData.de_fax.value=data;
document.FormData.de_direccion.value=data;
}

});

}
</script>

// Y EN respuesta.php


<?php include("../conexion.php");

$id_obra=$_REQUEST['id_obra'];
$SQL=mysql_query("SELECT ID_OBRA,DE_NUMERO,DE_TELEFONO,DE_FAX,DE_DIRECCION
from obra
WHERE ID_OBRA='$id_obra'",$cn);

$CapturaObra=mysql_fetch_array($SQL);

echo $CapturaObra['DE_NUMERO'];
echo $CapturaObra['DE_TELEFONO'];
echo $CapturaObra['DE_FAX'];
echo $CapturaObra['DE_DIRECCION'];
?>


// Ahora por el php no te preocupes, ya que es el lenguaje mas amigo que tengo,
pero creo que el problema de que imprima los 4 parametros en cada caja es del jquery, aver si le puedes hechar una mirada, y agregar un nuevo aporte..
Gracias...
  #7 (permalink)  
Antiguo 20/10/2010, 07:51
Avatar de Markgus  
Fecha de Ingreso: junio-2010
Mensajes: 152
Antigüedad: 13 años, 10 meses
Puntos: 5
Respuesta: Ayuda para capturar valor de un select

mira yo tengo algo parecido a lo que buscas, me guie de este aporte
http://www.forosdelweb.com/f77/puede...n-ajax-514521/

se usa la libreria prototype que la pudes descargar aqui
http://www.prototypejs.org/download

y pues en ese ejemplo en un archivo php se hace una consulta donde te muestre el arreglo y se te acomode segun en el text que quieras

Código PHP:
<?php
require("funciones_php/funciones.php");

$idc=$_GET['cliente'];

$link=conexiondb();
if(
$link!=1)
{
    
$consulta="select * from ccl_clientes where ccl_cliente_id='$idc'";
    
$re=mysql_query($consulta);
    
$ro=mysql_fetch_array($re);
    echo 
$ro[4]."||".$ro[6]."||".$ro[8];
}
?>
tal vez esta manera de acomodar los valores en el text te sirva en la forma de que lo estas haciendo, o si no pues puedes leerte el tema del link que te puse ahi ya esta resuelto

Última edición por Markgus; 20/10/2010 a las 07:56
  #8 (permalink)  
Antiguo 20/10/2010, 08:00
Avatar de chicohot20  
Fecha de Ingreso: mayo-2009
Mensajes: 388
Antigüedad: 15 años
Puntos: 43
Respuesta: Ayuda para capturar valor de un select

Hola PrincesaWeb, te dejo un ejemplo, es un poco diferente al ejemplo anterior que te dio Markgus:
formulario.php
Código PHP:
Ver original
  1. <script type="text/javascript" src="js/jquery.js"></script>
  2. <style>
  3. #div_oculto{display: none;}
  4. </style>
  5. <script type="text/javascript">
  6.  
  7.     $(document).ready(function(){
  8.         $("#id_obra").change(function(){
  9.             ajax($(this).val());
  10.         })
  11.     });
  12.  
  13.     function ajax(value){
  14.     var html="";
  15.     $.ajax({
  16.       url: "respuesta.php",
  17.       contentType:"application/x-www-form-urlencoded; charset=utf-8",
  18.       type:"GET",
  19.       data: "idcliente="+value,
  20.       error: function(){
  21.        alert('Error');
  22.       },
  23.       success: function(data){
  24.         //imprimo data en el div_oculto
  25.         $("#div_oculto").html(data);
  26.         //<span id="id">Option 1</span>';
  27.         //<span id="telefono">123456</span>';
  28.         //<span id="fax">123</span>';
  29.         //<span id="direccion">Peru</span>'
  30.         document.formulario.id.value=$("span#id").html();
  31.         document.formulario.telefono.value=$("span#telefono").html();
  32.         document.formulario.fax.value=$("span#fax").html();
  33.         document.formulario.direccion.value=$("span#direccion").html();
  34.        }
  35.     });
  36.     }
  37. </script>
  38. <div id="div_oculto"></div>
  39. <form name="formulario">
  40. <input type="text" name="id" /><br />
  41. <input type="text" name="telefono" /><br />
  42. <input type="text" name="fax" /><br />
  43. <input type="text" name="direccion" /><br />
  44. <select id="id_obra">
  45.  <option>Seleccione</option>
  46.  <option>Option 1</option>
  47.  <option>Option 2</option>
  48. </select>
  49. </form>

respuesta.php
Código PHP:
Ver original
  1. <?
  2. $id=$_GET["idcliente"];
  3. $telefono="123456";
  4. $fax="123";
  5. $direccion="Peru";
  6. echo '<span id="id">'.$id.'</span>';
  7. echo '<span id="telefono">'.$telefono.'</span>';
  8. echo '<span id="fax">'.$fax.'</span>';
  9. echo '<span id="direccion">'.$direccion.'</span>';
  10.  
  11. ?>
  #9 (permalink)  
Antiguo 20/10/2010, 08:59
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Respuesta: Ayuda para capturar valor de un select

ChicoHot20 :
Fantastico, ya lo probe y funciona de maravillas, y arroja cada parametro en su caja correspondiente.....

Solo si no es mucha molestia una consulta mas, como lo haria para arrojar uno de esos parametros en un select (osea dentro de otro select, no el select en el cual elegimos al cliente)....?????.

De todas formas Tema Solucionado.....
Gracias ChicoHot20 y tambien Markgus
  #10 (permalink)  
Antiguo 20/10/2010, 09:06
Avatar de Markgus  
Fecha de Ingreso: junio-2010
Mensajes: 152
Antigüedad: 13 años, 10 meses
Puntos: 5
Respuesta: Ayuda para capturar valor de un select

@PrincesaWeb yo tengo una duda similar apenas iba a postear para ver si chicohot20 o alguien me podria ayudar, esto es lo que iba a postear a ver si tenemos la misma duda

disculpa la molestia @chicohot20 se te ocurre alguna manera para que tambien se cargue el valor de un select, osea asi como esta que carga los text pero tmb cargue un select segun la opcion elegida, no se si me estoy explicando bien por que he visto unos ejemplos pero lo que hacen es que al seleccionar la opcion el otro select se pone con las opciones disponibles

y a mi lo que me gustaria es que en el select principal escojo yo una opcion y me manda los text con los datos asi como un select con el registro cargado

ejemplo el campo telefono supongamos que en vez de en un text esta en un select porque puede ser movil o de casa y pues al seleccionar en el primer select que se pongan los datos del text y tambien se cargue este select de telefono con la opcion almacenada
  #11 (permalink)  
Antiguo 20/10/2010, 09:17
Avatar de chicohot20  
Fecha de Ingreso: mayo-2009
Mensajes: 388
Antigüedad: 15 años
Puntos: 43
Respuesta: Ayuda para capturar valor de un select

Que bueno que te haya funcionado PrincesaWeb, a ver si me enseñas PHP :)

Aca les dejo un ejemplo de lo que piden: http://abrahanapaza.wordpress.com/20...n-ajax-jquery/
  #12 (permalink)  
Antiguo 20/10/2010, 09:20
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Respuesta: Ayuda para capturar valor de un select

Gracias ChicoHot20, lo revisare...

y Markgus a ver como te va nos cuentas.-

ya que al parecer solo nos falta poder arrojar el dato al select, ya que en la consulta ya nos trajimos el dato requerido para el select...

Última edición por PrincesaWeb; 20/10/2010 a las 09:26
  #13 (permalink)  
Antiguo 20/10/2010, 09:34
Avatar de ginitofl  
Fecha de Ingreso: diciembre-2006
Ubicación: Lima Perú
Mensajes: 349
Antigüedad: 17 años, 4 meses
Puntos: 22
Respuesta: Ayuda para capturar valor de un select

Hola a todos, tengan cuidado con este usuario se hace pasar por mujer para que puedan ayudarlo, su anterior cuenta era javiera_tierna.

Saludos.
  #14 (permalink)  
Antiguo 20/10/2010, 09:38
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Exclamación Respuesta: Ayuda para capturar valor de un select

jajaj,, aa tu eres el del mensaje de seguro,, mira no se que te pasa pero sus problemas no son los mios,,,,

ahora otra duda, se supone que hay moderadores y colaboradores, para este tipo de sujetos.. ???.

es un poco molesto.-
  #15 (permalink)  
Antiguo 20/10/2010, 11:02
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Respuesta: Ayuda para capturar valor de un select

Bueno chicos buscando la solucion me tope con este manual jquery, en español,

esta buenisimo, seguire buscando la solucion y si la encuentro se las posteo.

De todas formas muchas GRACIAS ChicoHot20.-

http://www.scribd.com/doc/36784059/Manual-Jquery

Tema 99 % Solucionado..........
  #16 (permalink)  
Antiguo 23/10/2010, 13:18
 
Fecha de Ingreso: agosto-2009
Mensajes: 4
Antigüedad: 14 años, 8 meses
Puntos: 0
Respuesta: Ayuda para capturar valor de un select

Hola haber si te sirve esta yudita

como ya estaras enterado jquery es un framework de lo mejor a mi particularmente me ayudo mucho, con respecto a tu pregunta esta seria una posible solucion.

<select name="garden">
<option selected="selected">Seleccione</option>
<option id="1">Hardware</option>
<option id="2">Software</option>
<option id="3">Internet</option>

</select>

<div id="mostrara"></div>

//jquery para obtener el id del select


$("select").change(function ()
{
var str = "";
$("select option:selected").each(function ()
{
<!--donde se captura el id del select;-->
str=$(this).attr("id");
});

if(str==1)
{
$("#mostrara").show(3000).load("hardware.html");
}
else
{
if(str==2)
{
$("#mostrara").show(3000).load("prueba3.html");
}
}
haber si te ayuda
  #17 (permalink)  
Antiguo 25/10/2010, 10:20
Avatar de Markgus  
Fecha de Ingreso: junio-2010
Mensajes: 152
Antigüedad: 13 años, 10 meses
Puntos: 5
Respuesta: Ayuda para capturar valor de un select

gracias ivan_inga la solucion era con el jquery yo encontre este tutorial donde lo explican d manera sencilla y usando bd que es lo que necesitamos

http://pixelar.me/selects-dependient...1/#comment-552

ya lo estoy adaptando a mi codigo por que mis 2 select traen datos de una BD, estoy haciendo pruebas cuando quede listo posteo el codigo ok
  #18 (permalink)  
Antiguo 30/10/2010, 11:43
Avatar de PrincesaWeb  
Fecha de Ingreso: octubre-2010
Mensajes: 24
Antigüedad: 13 años, 6 meses
Puntos: 0
Exclamación Respuesta: Ayuda para capturar valor de un select

Ok, Gracias ivann_inga y si estoy "enterada".

y Markgus por el link Funciona a la perfeccion probado y funcionando ()..

Sorry la demora por responder he estado trabajando demasiado aunque siempre siguiendo el foro...ok..

no coloco el codigo ya que en el link esta muy claro..... bueno y si alguien tiene duda lo posteo........ ahi me avisan... gracias..

Etiquetas: ajax, select
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:02.