seleccionar select y cargar valor a campo text

charlescuella · #1 (**permalink**) 03/08/2012, 22:04

hola tengo una duda

tengo un select en donde los valores los saco de la mi tabla productos mi tabla tiene estos campo poductos.id , productos.nombre , productos.valor

lo quiero hacer es que cuando yo utilice el select y seleccione un producto tenga un campo text este me muestre el valor

ej

select
producto1 valor 1
producto2 valor 2

cuando yo seleccione en mi select

producto 2 en mi campo text cargue el valor2

espero me entienda y me puedan colaborar gracias

ipraetoriux · #2 (**permalink**) 03/08/2012, 23:40

...puedes hacerlo con javascript...te doy un pequeño ejemplo

Código HTML:

Ver original<select name="valores" onchange="mostrarValor(this.value);">
<option value="1">Producto nro 1</option>
<option value="2">Producto nro 2</option>
<option value="3">Producto nro 3</option>
</select>
 
<input type="text" name="valoreninput" id="valoreninput" value="" />

luego en el archivo javascript

Código Javascript:

Ver originalvar mostrarValor = function(x){
     document.getElementById('valoreninput').value=x;
};

charlescuella · #3 (**permalink**) 04/08/2012, 19:48

disculpa y si yo es asi

select name="valores" onchange="mostrarValor(this.value);">
<option value="id_producto_1">nombre Producto nro 1</option>
<option value="id_prodcuto_2">nombre Producto nro 2</option>
<option value="id_producto_3">nombre Producto nro 3</option>
</select>

y en el input text quiero mostrar el valor del producto

espero me entiendan gracias

emprear · #4 (**permalink**) 04/08/2012, 20:26

Por usabilidad el evento onchange para este caso se mejora con la inclusión de un valor por defecto (que posteriormente no será tenido en cuenta en el procesamiento, puede ser un valor vacio.
De lo contrario, el cliente verá el producto1, y al clickear sobre este, al no haber "change" sobre el valor inicial, nada será colocado en el input

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[
var mostrarValor = function(x){
document.getElementById('valoreninput').value=x;
}
//]]>
</script>
</head>
<body>
 <form action="#">
<select name="valores" onchange="mostrarValor(this.value);">
<option value="<---" selected="selected">Seleccionar Producto</option>
<option value="1">Producto nro 1</option>
<option value="2">Producto nro 2</option>
<option value="3">Producto nro 3</option>
</select>
<input type="text" name="valoreninput" id="valoreninput" value="<---" />
</form>
</body>
</html>

Saludos