Ver Mensaje Individual
  #1 (permalink)  
Antiguo 07/09/2005, 10:43
aruizroldan
 
Fecha de Ingreso: octubre-2003
Mensajes: 280
Antigüedad: 20 años, 6 meses
Puntos: 1
Interactuar javascript con php

Hola.Quiero mostrar los datos de una base de datos.En la misma hay 4 imagenes (IMAGEN_G,IMAGEN_1,IMAGEN_2,IMAGEN_3).Bien. En el siguiente código,utilizo un javascript que muestra 4 imagenes del directorio actual (1,2,3,4.jpg)en forma de slideshow.Yo lo que quiero es q muestren las 4 imagenes que hay en la base de datos. ¿Como se haría? Os mando el código para una mayor comprensión:

<?php
//Conexión a la base de datos
mysql_connect("host","usuario","clave");
mysql_select_db("base_datos");

$_pagi_sql= "SELECT principal.NOMBRE AS NOMBRE,
principal.SUPERFICIE AS SUPERFICIE,
principal.ALTURA AS ALTURA,
principal.SITUACION AS SITUACION,
principal.DISTRIBUCION AS DISTRIBUCION,
principal.CALIDADES AS CALIDADES,
principal.PRECIO AS PRECIO,
principal.OBSERVACIONES AS OBSERVACIONES,
principal.IMAGEN_G AS IMAGEN_G,
principal.IMAGEN_1 AS IMAGEN_1,
principal.IMAGEN_2 AS IMAGEN_2,
principal.IMAGEN_3 AS IMAGEN_3,

principal.DESTINO AS DESTINO
FROM principal
WHERE ID='$id_imagen'";

$consulto = mysql_query($_pagi_sql);

//contamos con nuestra función, pasando el resultado a otra variable:
$nregistros = mysql_num_rows($consulto);

//Leemos y escribimos los registros de la página actual
while($row = mysql_fetch_array($consulto)) {

?>
<html>
<head>
<script type="text/javascript">

var numberslide=new Array()
numberslide[0]=["1.jpg", ""]
numberslide[1]=["2.jpg", ""]
numberslide[2]=["3.jpg", ""]
numberslide[3]=["4.jpg", ""]

Quiero q estas imagenes sean las de la base de datos


var mylinktarget=""
var mylinkcolor="black"
var mylinkcolorSelected="#c00027"

var imgborderwidth=0

var preloadit=new Array()
for (i=0;i<numberslide.length;i++){
preloadit[i]=new Image()
preloadit[i].src=numberslide[i][0]
}

var currentindex=""

function changeslides(which){
var imghtml=""
currentindex=(which=="initial")? 0 : parseInt(which)
var mode=(which=="initial")? "initial" : ""
var which=(mode=="initial")? numberslide[0] : numberslide[which]
if (which[1]!="")
imghtml='<a href="'+which[1]+'" target="'+mylinktarget+'">'
imghtml+='<img src="'+which[0]+'" border="'+imgborderwidth+'" height="327px" width="240px">'
if (which[1]!="")
imghtml+='</a>'

if (mode=="initial")
document.write('<div>'+imghtml+'</div>')
else{
document.getElementById("imagecontainer").innerHTM L=imghtml
changecolors()
}
}

function createnumbers(){
document.write('<a href="javascript:changeslides(0)" style="color:'+mylinkcolorSelected+'">0</a> ')
for (i=1; i< numberslide.length; i++)
document.write('<a href="javascript:changeslides(\''+i+'\')">'+i+'</a> ')
}

function changecolors(){
var numberobj=document.getElementById("numberDiv")
numberlinks=numberobj.getElementsByTagName("A")
for (i=0; i<=currentindex; i++)
numberlinks[i].style.color=mylinkcolorSelected
for (i=currentindex+1; i<numberslide.length; i++)
numberlinks[i].style.color=mylinkcolor
}

function goforward(){
if (currentindex<numberslide.length-1)
changeslides(currentindex+1)
}

function goback(){
if (currentindex!=0)
changeslides(currentindex-1)
}

</script>
<title>Arteloft - Ficha</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel=stylesheet href="../estilos.css" type=text/css>
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" background="../Administracion/Images/background.gif">
<div id="slideshowContainer">
<table id="Tabla_01" width="691" height="601" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td>
<a href="javascript:history.back()"><img src="Images/index_01.jpg" width="76" height="22" alt="Volver"></a></td>
<td colspan="4" rowspan="2" width="186" height="67" bgcolor="#000000">
</td>
<td rowspan="2">
<img src="Images/index_03.jpg" width="165" height="67" alt=""></td>
<td rowspan="2" width="264" height="67" bgcolor="#000000">
</td>
</tr>
<tr>
<td width="76" height="45" bgcolor="#000000">
</td>
</tr>
<tr>
<td colspan="4" rowspan="2">
<img src="Images/index_06.jpg" width="241" height="37" alt=""></td>
<td colspan="3">
<img src="Images/index_07.jpg" width="450" height="3" alt=""></td>
</tr>
<tr>
<td colspan="3" bgcolor="#C00027" width="450" height="34" class="blanco">&nbsp;&nbsp;&nbsp;&nbsp;
<b><? echo $row['NOMBRE']; ?> ></b> <? echo $row['SUPERFICIE']; ?> m<sup>2</sup>
</td>
</tr>
<tr>
<td colspan="4">
<img src="Images/index_09.jpg" width="241" height="2" alt=""></td>
<td colspan="3" rowspan="5" width="450" height="404" bgcolor="#FFFFFF" valign="top">
<br><br>

<table width="90%" border="0" align="center">
<tr>
<td width="32%" valign="top"><strong>Superficie:</strong></td>
<td width="68%"><? echo $row['SUPERFICIE']; ?> m<sup>2</sup></td>
</tr>
<tr>
<td width="32%" height="7"></td>
<td width="68%"></td>
</tr>
<tr>
<td valign="top"><strong>Altura:</strong></td>
<td><? echo $row['ALTURA']; ?> mts</td>
</tr>
<tr>
<td width="32%" height="7"></td>
<td width="68%"></td>
</tr>
<tr>
<td valign="top"><strong>Situaci&oacute;n:</strong></td>
<td><? echo $row['SITUACION']; ?></td>
</tr>
<tr>
<td width="32%" height="7"></td>
<td width="68%"></td>
</tr>
<tr>
<td valign="top"><strong>Distribuci&oacute;n:</strong></td>
<td><? echo $row['DISTRIBUCION']; ?></td>
</tr>
<tr>
<td width="32%" height="7"></td>
<td width="68%"></td>
</tr>
<tr>
<td valign="top"><strong>Calidades:</strong></td>
<td><? echo $row['CALIDADES']; ?></td>
</tr>
<tr>
<td width="32%" height="7"></td>
<td width="68%"></td>
</tr>
<tr>
<td valign="top"><strong>Precio:</strong></td>
<td><? echo $row['PRECIO']; ?> €</td>
</tr>
<tr>
<td width="32%" height="7"></td>
<td width="68%"></td>
</tr>
<tr>
<td valign="top"><strong>Observaciones:</strong></td>
<td><? echo $row['OBSERVACIONES']; ?></td>
</tr>
</table>

</td>
</tr>
<tr>
<td colspan="3" width="240" height="327">
<div id="imagecontainer">
<script type="text/javascript">
changeslides("initial")
</script>
</div>

</td>
<td rowspan="4">
<img src="Images/index_12.jpg" width="1" height="402" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2" width="129" height="30" bgcolor="#FFFFFF">
<div id="numberDiv">
<script type="text/javascript">
createnumbers() //This call writes out the numbers
</script>
</div>


</td>
<td>
<img src="Images/index_14.jpg" width="111" height="15" alt=""></td>
</tr>
<tr>
<td>
<img src="Images/index_15.jpg" width="111" height="15" alt=""></td>
</tr>
<tr>

<td colspan="3"> <a href="mailto://[email protected]"><img src="Images/index_16.jpg" alt="Contacto" width="240" height="45" border="0"></a></td>
</tr>
<tr>

<td colspan="7" width="691" height="68" bgcolor="#000000" valign="middle" align="center"><img src="Images/financiacion.jpg" width="116" height="26">
</td>
</tr>
<tr>
<td colspan="7">
<img src="Images/index_18.jpg" width="691" height="1" alt=""></td>
</tr>
<tr>
<td colspan="7" width="691" height="23" bgcolor="#000000" align="center" class="rojo">
Teléfono de contacto : 630 46 03 36 - Email : [email protected]
</td>
</tr>
<tr>
<td>
<img src="Images/espacio.gif" width="76" height="1" alt=""></td>
<td>
<img src="Images/espacio.gif" width="53" height="1" alt=""></td>
<td>
<img src="Images/espacio.gif" width="111" height="1" alt=""></td>
<td>
<img src="Images/espacio.gif" width="1" height="1" alt=""></td>
<td>
<img src="Images/espacio.gif" width="21" height="1" alt=""></td>
<td>
<img src="Images/espacio.gif" width="165" height="1" alt=""></td>
<td>
<img src="Images/espacio.gif" width="264" height="1" alt=""></td>
</tr>
</table>
</div>
</body>
<? } ?>
</html>