Ayuda para capturar valor de un select

[PrincesaWeb]

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

[chicohot20]

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:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    function ajax(value){
    var html="";
    $.ajax({
      url: "pagina.php",
      contentType:"application/x-www-form-urlencoded; charset=utf-8",
      type:"GET", 
      data: "idcliente="+value,
      error: function(){
       alert('Error');
      },
      success: function(data){
        //Aca recibo la respuesta de pagina.php
        //POr ejemplo
        document.form.input.value=data;
       }
    });
    }
</script>
 

Este es el HTML,aunque con jquery tambien puedes manipular los eventos del select.

Código HTML:

<select onchange="ajax(this.value)">
 <option>Option 1</option>
 <option>Option 2</option>
</select>
 

[PrincesaWeb]

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.-

[PrincesaWeb]

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.-
-----------------------------

[chicohot20]

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:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    function ajax(value){
    var html="";
    $.ajax({
      url: "respuesta.php",
      contentType:"application/x-www-form-urlencoded; charset=utf-8",
      type:"GET", 
      data: "idcliente="+value,
      error: function(){
       alert('Error');
      },
      success: function(data){
        //Aca recibo la respuesta de respuesta.php
        document.formulario.campo.value=data;
       }
    });
    }
</script>
<form name="formulario">
<input type="text" name="campo" />
<select onchange="ajax(this.value)">
 <option>Option 1</option>
 <option>Option 2</option>
</select>
</form>
 

Y este es repuesta.php

Código PHP:

//aca capturas los parametros enviados desde AJAX, en este caso IDCLIENTE
//Haces tu consulta SQL, por ejemplo quieres obtener el nombre del cliente
$nombre="Luis"
echo $nombre;
//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.

[PrincesaWeb]

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...

[Markgus]

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

[chicohot20]

Hola PrincesaWeb, te dejo un ejemplo, es un poco diferente al ejemplo anterior que te dio Markgus:
formulario.php

Código PHP:

<script type="text/javascript" src="js/jquery.js"></script>
<style>
#div_oculto{display: none;}
</style>
<script type="text/javascript">
 
    $(document).ready(function(){
        $("#id_obra").change(function(){
            ajax($(this).val());
        })
    });
 
    function ajax(value){
    var html="";
    $.ajax({
      url: "respuesta.php",
      contentType:"application/x-www-form-urlencoded; charset=utf-8",
      type:"GET", 
      data: "idcliente="+value,
      error: function(){
       alert('Error');
      },
      success: function(data){
        //imprimo data en el div_oculto
        $("#div_oculto").html(data);
        //<span id="id">Option 1</span>';
        //<span id="telefono">123456</span>';
        //<span id="fax">123</span>';
        //<span id="direccion">Peru</span>'
        document.formulario.id.value=$("span#id").html();
        document.formulario.telefono.value=$("span#telefono").html();
        document.formulario.fax.value=$("span#fax").html();
        document.formulario.direccion.value=$("span#direccion").html();
       }
    });
    }
</script>
<div id="div_oculto"></div>
<form name="formulario">
<input type="text" name="id" /><br />
<input type="text" name="telefono" /><br />
<input type="text" name="fax" /><br />
<input type="text" name="direccion" /><br />
<select id="id_obra">
 <option>Seleccione</option>
 <option>Option 1</option>
 <option>Option 2</option>
</select>
</form>
 

respuesta.php

Código PHP:

<?
$id=$_GET["idcliente"];
$telefono="123456";
$fax="123";
$direccion="Peru";
echo '<span id="id">'.$id.'</span>';
echo '<span id="telefono">'.$telefono.'</span>';
echo '<span id="fax">'.$fax.'</span>';
echo '<span id="direccion">'.$direccion.'</span>';
 
?>
 

[PrincesaWeb]

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

[Markgus]

@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

[chicohot20]

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/

[PrincesaWeb]

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...

[ginitofl]

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

Saludos.

[PrincesaWeb]

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.-

[PrincesaWeb]

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..........

[ivann_inga]

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

[Markgus]

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

[PrincesaWeb]

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..