ayuda con divicion flotante con datos

dante14 · #1 (**permalink**) 17/03/2009, 16:33

mi consulta es la siguiente:

tengo una caja de texto, a su lado derecho un boton, el cual al ser precionado ara q salga una divicion encima de mi pagina
en esta divicion flotante hay cuadros
los cuadros contienen nombre, estado y tipo, los cuales estan en la base de datos
como podria hacer para q al precionar un cuadro sus datos me los guarde en la caja de texto

la base de datos esta creada y con datos insertados

trabajo con php y mysql

seiferdrg · #2 (**permalink**) 17/03/2009, 17:28

Al crear los cuadros le añades al tag un

Código PHP:

  onclick="mifuncion(nombre, estado, tipo)"

Por supuesto donde pone nombre, estado y tipo deberia cargarse el valor por ejemplo:

Código PHP:

 
onclick="mifuncion('<?php echo $nombre ?>', '<?php echo $estado ?>', '<?php echo $tipo ?>')"

Y luego crear "mifuncion" en javascript

Código PHP:

  function mifuncion(nombre, estado tipo){
    document.getElementById("ID DEL INPUT").value = "NOMBRE: " + nombre....
}

No se si es eso lo que querias, almenos es lo que he entendido.

dante14 · #3 (**permalink**) 17/03/2009, 19:58

e avanzado con lo q pusiste arriba, lo q kisiera es lo q te explico abajo
gracias x todo

Código HTML:

<html>
<head>
</head>
<body>
<input name="datos" id="datos" type="text" />
<input name="datos2" id="datos2" type="text" />
<input name="datos3" id="datos3" type="text" />
<input name="ver" id="ver" type="button" value="ver" onclick="mifuncion('<?php echo $nombre ?>', '<?php echo $estado ?>', '<?php echo $tipo ?>')" />
<script>
function mifuncion(nombre, estado, tipo){
    document.getElementById("datos").value = "Nombre: " + nombre;
	document.getElementById("datos2").value = "Estado: " + estado;
	document.getElementById("datos3").value = "Tipo: " + tipo;
	
}  
</script>
</body>
</html>

lo q kiero es q al hacer clic en el boton me salga una divicion q este encima de todo, en la cual va a ver varios cuadros, y io al hacer clic en el cuadro, me guarda automaticamente sus datos en su respectivo caja de texto

por ejemplo
tengo 10 cuadros
en el primer cuadro:
nombre: Gaseosa
estado: buen estado
tipo : comestible
cuado 2
nombre: Galletas
estado: buen estado
tipo : comestible

y asi sucesivamente los cuadros

io ago clic en el cuadro nro uno y en las cajas de texto tiene q ponerme los datos del respectivo cuadro
¿como lo aria ?

seiferdrg · #4 (**permalink**) 18/03/2009, 02:43

Prueba así.

Creamos un div oculto con cada cuadro, en cada cuadro llamamos a la funcion con los parametros correspondientes.

Código PHP:

 
   <div id="cuadro1" onclick="mifuncion('<?php echo $nombre1 ?>', '<?php echo $estado1 ?>', '<?php echo $tipo1 ?>')" >Cuadro 1</div>

Y en el boton lo que hacemos es mostrar el div que contiene los cuadros, dentro de cada cuadro puedes poner lo que quieras

Código PHP:

 
<html>
<head>
</head>
<body>
<div id="cuadros" style="display:none">
   <div id="cuadro1" onclick="mifuncion('<?php echo $nombre1 ?>', '<?php echo $estado1 ?>', '<?php echo $tipo1 ?>')" >Cuadro 1</div>
    <div id="cuadro2" onclick="mifuncion('<?php echo $nombre2 ?>', '<?php echo $estado2 ?>', '<?php echo $tipo2 ?>')" >Cuadro2</div>
</div>
<input name="datos" id="datos" type="text" />
<input name="datos2" id="datos2" type="text" />
<input name="datos3" id="datos3" type="text" />
<input name="ver" id="ver" type="button" value="ver" onclick="document.getElementById('cuadros').style.display = 'block'" />
<script>
function mifuncion(nombre, estado, tipo){
    document.getElementById("datos").value = "Nombre: " + nombre;
    document.getElementById("datos2").value = "Estado: " + estado;
    document.getElementById("datos3").value = "Tipo: " + tipo;
    
}  
</script>
</body>
</html>

lalo0002 · #5 (**permalink**) 18/03/2009, 10:54

gracias eso es lo q keria, pero como puedo hacer para q esa divicio tape la pagina, me refiero a q este ensima de mis diviciones donde esta mi pagina

se hace con z-index ? con css ?

seiferdrg · #6 (**permalink**) 20/03/2009, 03:20

Poniendole position absolute lo puedes cargar por encima. Para centrarlo en la pagina le das width y height fijos y le pones left:50%, height:50% y margin-left: -WIDTH/2; margin-top -HEIGHT/2;

donde WIDTH/2 lo has de poner numericamente y HEIGHT/2 también. Luego en la funcion que rellena los datos puedes poner un
document.getElementById('cuadros').style.display = 'none'
Para que al clicar sobre un cuadro se oculte.

Código PHP:

 
<div id="cuadros" style="display:none; position: absolute;left:50%; margin-left:-100px; width:100px; top:50%;">
   <div id="cuadro1" onclick="mifuncion('<?php echo $nombre1 ?>', '<?php echo $estado1 ?>', '<?php echo $tipo1 ?>')" >Cuadro 1</div>
    <div id="cuadro2" onclick="mifuncion('<?php echo $nombre2 ?>', '<?php echo $estado2 ?>', '<?php echo $tipo2 ?>')" >Cuadro2</div>
</div>