me sirvira un array como lo hago¿?

pablobuitres · #1 (**permalink**) 21/02/2011, 15:00

hola amigos,les tengo una consulta. tengo un script que etiqueta imagenes, y funciona bastante bien, el problema lo tengo cuando quiero ver todas las etiquetas que se pusieron sobre la imagen, estas son guardas en mysql, pero a la hora de hacer la consulta solo me imprime la ultima, hace tiempo que busco una solucion, ahora se me ocurrio que mandando las identidad de las etiquetas en un array tal vez asi podria hacer corresponder a cada consulta una identidad no se si alguien me entienden, como notaran no me se explicar y no se mucho de php de todas formas les agradesco y bueno si no soy claro les explico mejor o publico codigo, gracias

walterdevel · #2 (**permalink**) 21/02/2011, 15:03

Las dos cosas vendrían bien, explicate mejor y pon algo de codigo :P

pablobuitres · #3 (**permalink**) 21/02/2011, 15:05

<?php
include('config.php');
?>
<?php
$result=mysql_query("select z from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
// echo $row['z'];echo '<br>';
$a=$row['z'];
}

?>
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>Making an Interactive Picture with jQuery | Build Internet!</title>

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){

//Blur Links (Prevents Outline)
$('a').click(function() {
this.blur();
});

//Hide all item descriptions in the info box
$("#infobox > div").css("display", "none");

//Call in the info box
$(".more a").click(function(){
$("#infobox").animate({bottom: '233px' }, 300);
$("#fade_bg").fadeIn();
return false;
});

//Expand more info button on hover
$(".more").hover(function(){
$(this).stop().animate({width: '225px' }, 200).css({'z-index' : '10'}); //Change the width increase caption size
}, function () {
$(this).stop().animate({width: '50px' }, 200).css({'z-index' : '1'});
});

//Show description for selected item
$("#couch a").click(function(){
$("#couch_info").show();
});

$("#plant a").click(function(){
$("#plant_info").show();
});

$("#monitor a").click(function(){
$("#monitor_info").show();
});

$("#board a").click(function(){
$("#board_info").show();
});

//Remove background, info box and hide all descriptions
$("#fade_bg, .close").click(function(){
$("#fade_bg").fadeOut();
$("#infobox").animate({bottom: '-200px' }, 300, function() {
$("#infobox > div").css("display", "none");
});
return false;
});

});
</script>

<style type="text/css">

/* General Styles */
*{ padding:0px; margin:0px; }
img{ border: none; }
a:focus, a:active{ outline:none; }
body{ text-align:center; background:#FFF; }
h1{ font:bold 18px Helvetica, Arial, sans-sarif; color:#FFF; margin:20px 0 0 0; }

/* Picture Styles */
#picture{ position:relative; top:20px; width:600px; height:450px; margin:0px auto;background:#FFF url('http://localhost/localhost/miniaturas/<?php
$result=mysql_query("select * from aa where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo $row['chica'];
}?>'); overflow:hidden;}

/* General More Button */
.more{ position:absolute; width:50px; height:50px; background:url('dim.png'); border:1px solid #444; padding:5px; text-align:left; overflow:hidden; }

.more span{ position:absolute; left:60px; width:160px; padding:15px 0 0 5px; color:#FFF; font:bold 13px Lucida Grande, Arial, sans-serif; text-shadow:#000 1px 1px 0px; }

/* Item Specific More Button */

#board{ top:<?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo $row['x'];
}

?>
px
; left:<?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo $row['y'];
}

?>px; }

/* General Info Box */
#infobox{ position:absolute; bottom:-200px; left: 350px; height:200px; width:300px; z-index:20; margin:0 0 -100px -150px; background:#FFF; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
#infobox a, #infobox a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox a:hover{ text-decoration:underline; }

/* Close button for info box */
span.close{position:absolute; right:5px; top:5px;}

/* The dimmed background when the info box is showing */
#fade_bg{ position:absolute; z-index:15; width:100%; height:100%; background:url('dim.png'); display:none;}

</style>

</head>

<body>
<h1>etiqueta estas imagenes</h1>
<div id="picture">



<div class="more" id="board">
<a href="#"><img src=""/></a>
<span><?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo $row['etiqueta'];
}

?>
</span>
</div>

</body>
</html>

pablobuitres · #4 (**permalink**) 21/02/2011, 15:07

en la tabla nuevas estan las etiquetas las coordenadas, el nombre de la imagen y el auto_increment, nuevas es foranea de aa,
supongamos q para imagen12 tengo 5 etiquetas quiero q en al imagen se imprimarn las 5, tengo la consulta pero no imprime ninguna si son mas de una lsa guardas se entiende?

walterdevel · #5 (**permalink**) 21/02/2011, 15:25

El campo id en la tabla nuevas no es único? Si es así, siempre te va a traer un solo registro.

pablobuitres · #6 (**permalink**) 21/02/2011, 15:31

no. no es por eso,te cuento un poco lo que pobre, vistes #board ahi hace la consulta para meter las coordenas en el css, bueno eso lo copie y pegue varias veces le asigne nuevo nombre, lo mismo mas abajo donde hce imprir la etiqueta, y a esa consulta le agrege un and id="2" o cualquir numero y pòr un momento funciono imprimio en cada consultala etiqueta correspondiente, el tema es que es infinito el campo id y no puedo poner infinitas consultas, se entiende?

walterdevel · #7 (**permalink**) 21/02/2011, 15:37

No, la verdad no te estoy entendiendo. Podés poner la estructura de la tabla que usas para esto?

Lo que haces es, según entiendo, cargar una imagen y traer todas las etiquetas de la imagen y colocarlas con sus x e y con css sobre la imagen, es así?

pablobuitres · #8 (**permalink**) 21/02/2011, 15:43

exacto, el tema que las consultas a mysql, traen varias coordenas, etiquetas, y php no las procesa como registros distintos, si para una imagen hay cuardado una etiqueta y una coordena la imprime arriba de la imagen.
la estructura te lo pongo en criollo identidad(int), imagen (varchar), etiqueta(varchar),x(varchar),y(varchar), z(int) z tiene el auto increment yo hoy te te lo nombre como id, el campo identidad recoge la identidad de la imagen.

walterdevel · #9 (**permalink**) 21/02/2011, 15:57

Entonces es como te decía, tenés que buscar los registros por el campo identidad:

Código PHP:

Ver original$result=mysql_query("select * from nuevas where identidad='".$_GET['identidad']."'");

Es la asociación que tenés entre los registro de una misma imagen, entonces vas a traer así todos los registros asociados, sea lo que sea que tenga como valor "z", que en realidad no te importaría.

pablobuitres · #10 (**permalink**) 21/02/2011, 16:05

si en eso tenes razon, de hecho lo tengo asi en el codigo, lo que trato de hacer es que no me ponga todas las coordenadas o todos los nombres como uno sola palabra, por que con ese codigo php recibe todos los registros de esa imagen y no le asigna una etiqueta a cada uno, sino que algo esta mal y lo lee como una palabra sola.
#board{ top:<?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo $row['x'];
}

?>
px
; left:<?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo $row['y'];
}

?>px; }
viste ahí! si tengo para una imagen varias x y varias y php me lee mal y no asigna un punto a cada una de las coordenadas

walterdevel · #11 (**permalink**) 21/02/2011, 16:13

Es porque estás asignando siempre al mismo id ( #board ). Tenés que crear divs con ids diferentes por ejemplo:

Código PHP:

Ver original$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo "<div id='board".$row['z']."'>".$row['etiqueta']."</div>";
}

y para el css:

Código PHP:

Ver original<?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo "#board".$row['z']."{top:".$row['y']."px; left:".$row['x']."px;}";
}
 
?>

pablobuitres · #12 (**permalink**) 21/02/2011, 16:32

sabes que no me anda esta linea tiene algun problema de comillas o algo
echo "#board"$row['z']."{top:".$row['y']."px; left:".$row['x']."px;}";

walterdevel · #13 (**permalink**) 21/02/2011, 16:34

Lo edité para corregirlo, es así:

Código PHP:

Ver originalecho "#board".$row['z']."{top:".$row['y']."px; left:".$row['x']."px;}";

pablobuitres · #14 (**permalink**) 21/02/2011, 16:44

mira algo logre pero no te creas q es mucho, no digo que tu razonamiento no sea correcto, al contrario mas que gracias tengo que darte, pero aun no logro mi objetivo
no quiero abusar de tu gentileza pero la verdad que no me sale nada!

walterdevel · #15 (**permalink**) 21/02/2011, 16:53

Mira, mientras ande por acá te puedo ayudar. Pegá tu código para ver como quedó ahora ( usa las etiquetas del foro para diferenciar php y html, así es más entendible XD

pablobuitres · #16 (**permalink**) 21/02/2011, 17:03

<?php
include('config.php');
?>
<?php
$result=mysql_query("select z from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
// echo $row['z'];echo '<br>';
$a=$row['z'];
}

?>
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>Making an Interactive Picture with jQuery | Build Internet!</title>

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){

//Blur Links (Prevents Outline)
$('a').click(function() {
this.blur();
});

//Hide all item descriptions in the info box
$("#infobox > div").css("display", "none");

//Call in the info box
$(".more a").click(function(){
$("#infobox").animate({bottom: '233px' }, 300);
$("#fade_bg").fadeIn();
return false;
});

//Expand more info button on hover
$(".more").hover(function(){
$(this).stop().animate({width: '225px' }, 200).css({'z-index' : '10'}); //Change the width increase caption size
}, function () {
$(this).stop().animate({width: '50px' }, 200).css({'z-index' : '1'});
});

//Show description for selected item
$("#couch a").click(function(){
$("#couch_info").show();
});

$("#plant a").click(function(){
$("#plant_info").show();
});

$("#monitor a").click(function(){
$("#monitor_info").show();
});

$("#board a").click(function(){
$("#board_info").show();
});

//Remove background, info box and hide all descriptions
$("#fade_bg, .close").click(function(){
$("#fade_bg").fadeOut();
$("#infobox").animate({bottom: '-200px' }, 300, function() {
$("#infobox > div").css("display", "none");
});
return false;
});

});
</script>

<style type="text/css">

/* General Styles */
*{ padding:0px; margin:0px; }
img{ border: none; }
a:focus, a:active{ outline:none; }
body{ text-align:center; background:#FFF; }
h1{ font:bold 18px Helvetica, Arial, sans-sarif; color:#FFF; margin:20px 0 0 0; }

/* Picture Styles */
#picture{ position:relative; top:20px; width:600px; height:450px; margin:0px auto;background:#FFF url('http://localhost/localhost/miniaturas/<?php
$result=mysql_query("select * from aa where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo $row['chica'];
}?>'); overflow:hidden;}

/* General More Button */
.more{ position:absolute; width:50px; height:50px; background:url('dim.png'); border:1px solid #444; padding:5px; text-align:left; overflow:hidden; }

.more span{ position:absolute; left:60px; width:160px; padding:15px 0 0 5px; color:#FFF; font:bold 13px Lucida Grande, Arial, sans-serif; text-shadow:#000 1px 1px 0px; }

/* Item Specific More Button */

<?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo "#board".$row['z']."{top:".$row['y']."px; left:".$row['x']."px;}";

}

?>

/* General Info Box */
#infobox{ position:absolute; bottom:-200px; left: 350px; height:200px; width:300px; z-index:20; margin:0 0 -100px -150px; background:#FFF; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
#infobox a, #infobox a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox a:hover{ text-decoration:underline; }

/* Close button for info box */
span.close{position:absolute; right:5px; top:5px;}

/* The dimmed background when the info box is showing */
#fade_bg{ position:absolute; z-index:15; width:100%; height:100%; background:url('dim.png'); display:none;}

</style>

</head>

<body>
<h1>etiqueta estas imagenes</h1>
<div id="picture">


<?php
$result=mysql_query("select * from nuevas where id='".$_GET['identidad']."'");
while ($row = mysql_fetch_array($result))
{
echo "<div id='board".$row['z']."'>".$row['etiqueta']."</div>";
}

?>

</body>
</html>

amigo la parte de las etiquetas del foro perdoname pero te las debo, por la verdad, que no se como ponerlas mil disculpas.
lo que veo es mi imagen y en el medio toda una lista con los nombres de las etiquetas, pero no estan en su lugar ni nada

walterdevel · #17 (**permalink**) 21/02/2011, 17:07

Probá cambiar top por margin-top y left por margin-left. Como no tienen posición absoluta, no se van a posicionar con el top y left.

pablobuitres · #18 (**permalink**) 21/02/2011, 17:11

hice eso y solo me imprime la primer etiqueta,

pablobuitres · #19 (**permalink**) 21/02/2011, 17:17

lo otro que habia pensado es limitar el numeo de etiquetas en la imagen a ej;10,
copio y pego la parte de consulta a mysql por ej,el#board y atro ponele que le pongo#board2...
#board10 y le hago cooresponder a cada uno uno de los registro guardados lo haria por medio de la identidad, la cosa seria como mandar a esta pagina la informacion y como hacer para que php la interprete por eso hoy pense en Array pero la verdad no se mucho de ese tema, mas bien nada, que opinas?

walterdevel · #20 (**permalink**) 21/02/2011, 17:22

Podés pegar el código html que te genera así como está?

pablobuitres · #21 (**permalink**) 21/02/2011, 17:25

<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>Making an Interactive Picture with jQuery | Build Internet!</title>

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){

//Blur Links (Prevents Outline)
$('a').click(function() {
this.blur();
});

//Hide all item descriptions in the info box
$("#infobox > div").css("display", "none");

//Call in the info box
$(".more a").click(function(){
$("#infobox").animate({bottom: '233px' }, 300);
$("#fade_bg").fadeIn();
return false;
});

//Expand more info button on hover
$(".more").hover(function(){
$(this).stop().animate({width: '225px' }, 200).css({'z-index' : '10'}); //Change the width increase caption size
}, function () {
$(this).stop().animate({width: '50px' }, 200).css({'z-index' : '1'});
});

//Show description for selected item
$("#couch a").click(function(){
$("#couch_info").show();
});

$("#plant a").click(function(){
$("#plant_info").show();
});

$("#monitor a").click(function(){
$("#monitor_info").show();
});

$("#board a").click(function(){
$("#board_info").show();
});

//Remove background, info box and hide all descriptions
$("#fade_bg, .close").click(function(){
$("#fade_bg").fadeOut();
$("#infobox").animate({bottom: '-200px' }, 300, function() {
$("#infobox > div").css("display", "none");
});
return false;
});

});
</script>

<style type="text/css">

/* General Styles */
*{ padding:0px; margin:0px; }
img{ border: none; }
a:focus, a:active{ outline:none; }
body{ text-align:center; background:#FFF; }
h1{ font:bold 18px Helvetica, Arial, sans-sarif; color:#FFF; margin:20px 0 0 0; }

/* Picture Styles */
#picture{ position:relative; top:20px; width:600px; height:450px; margin:0px auto;background:#FFF url('http://localhost/localhost/miniaturas/1pic_graciela 026.jpg'); overflow:hidden;}

/* General More Button */
.more{ position:absolute; width:50px; height:50px; background:url('dim.png'); border:1px solid #444; padding:5px; text-align:left; overflow:hidden; }

.more span{ position:absolute; left:60px; width:160px; padding:15px 0 0 5px; color:#FFF; font:bold 13px Lucida Grande, Arial, sans-serif; text-shadow:#000 1px 1px 0px; }

/* Item Specific More Button */

#board1{margin-top:406px; margin-left:127px;}#board8{margin-top:293px; margin-left:273px;}#board9{margin-top:293px; margin-left:273px;}#board10{margin-top:293px; margin-left:273px;}#board13{margin-top:307px; margin-left:263px;}#board14{margin-top:307px; margin-left:263px;}

/* General Info Box */
#infobox{ position:absolute; bottom:-200px; left: 350px; height:200px; width:300px; z-index:20; margin:0 0 -100px -150px; background:#FFF; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
#infobox a, #infobox a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox a:hover{ text-decoration:underline; }

/* Close button for info box */
span.close{position:absolute; right:5px;margin-top :5px;}

/* The dimmed background when the info box is showing */
#fade_bg{ position:absolute; z-index:15; width:100%; height:100%; background:url('dim.png'); display:none;}

</style>

</head>

<body>
<h1>etiqueta estas imagenes</h1>
<div id="picture">


<div id='board1'>gg</div><div id='board8'>n</div><div id='board9'>n</div><div id='board10'>n</div><div id='board13'>nacional</div><div id='board14'>nacional</div>

</body>
</html>

walterdevel · #22 (**permalink**) 21/02/2011, 17:34

Agregale position:relative a los #board1, etc. Y te falta cerrar el div picture.

pablobuitres · #23 (**permalink**) 21/02/2011, 17:43

sabes qeue le puse y me pone el nombre de las etiquetas por el medio de la imagen sin respetar las coordenadas
te agradesco pila, q estas invirtiendo tiempo en este, pero la verdad q yo ya no enteindo nada, espero no haberlo puesto mal, no quiero abusar, si tenes mas o menos un codigo posteamelo, por que no se ni donde estoy parado

walterdevel · #24 (**permalink**) 21/02/2011, 17:49

Yo te diría que lo dejes para mañana cuando estés más despierto. Con lo que tenés hasta acá ya te funciona, te queda corregir lo de las ubicaciones con css, y en eso no voy a poder ayudarte mucho.

pablobuitres · #25 (**permalink**) 21/02/2011, 17:51

la verdad que mil gracias, si en el codigo fuente marca las etiquetas, te agradesco mucho, y bueno loco un gusto, no se nio de donde sos, ni donde aprendiste pero que se yo me dedicaste mucho tiempo, y lo aprovechaste bien, nuevamente gracias!

walterdevel · #26 (**permalink**) 21/02/2011, 17:56

De nada, soy argentino. Un vecino :P

pablobuitres · #27 (**permalink**) 21/02/2011, 17:58

jajaja como decia la propaganda de t.v de aca un hermano!