Hola a todos. Estoy desarrollando una pagina, y nesecito traer todos los productos de la base de datos.
La tabla de productos posee los siguientes atributos:
id : clave primaria
marca : marca del producto
modelo : modelo del producto
precio : precio del producto
detalle : detalle del producto
cantidad : cantidad disponible
Estos son los 3 archivos con los cuales estoy trabajando:
index.html : llama a la funcion "processData()" del archivo procesoJS.js.
procesoJS.js : interactua con el archivo "proceso.php" y recoge los datos xml.
proceso.php : recupera los datos de la tabla productos, y le da formato XML.
INDEX.HTML Código HTML:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Parrillla de Datos</title>
<script language="javascript" src="procesoJS.js"></script>
</head>
<body>
<font color="#FF0000"><b><div id="esta"></div></b></font>
<h1>Productos obtenidos de la Base de Datos</h1>
<form>
<input type="button" value="ver productos" onclick="processData();" />
</form>
<table border="1">
<tr>
<td id="id"></td>
<td id="marca"></td>
<td id="modelo"></td>
<td id="precio"></td>
<td id="cant"></td>
<td id="det"></td>
</tr>
</table>
</body>
</html>
PROCESOJS.JS Cita: function getXMLHTTPRequest() {
try {
req = new XMLHttpRequest();
} catch(err1) {
try {
req = new ActiveXObject("Msxml2.XMLHTTP");
} catch (err2) {
try {
req = new ActiveXObject("Microsoft.XMLHTTP");
} catch (err3) {
req = false;
}
}
}
return req;
}
var xmlDoc = getXMLHTTPRequest();
function processData()
{
if(window.ActiveXObject)
{
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;
xmlDoc.load("proceso.php");
show();
}
else if(document.implementation.createDocument)
{
xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.load("proceso.php");
xmlDoc.onload = show;
}
else
{
alert("Browser doesn't support XML DOM manipulation");
}
}
function show()
{
var dato = xmlDoc.getElementsByTagName("id");
for(var i=0; i < dato.length; i++)
{
var id = xmlDoc.getElementsByTagName("id")[i].childNodes[0].nodeValue;
var marca = xmlDoc.getElementsByTagName("marca")[i].childNodes[0].nodeValue;
var modelo = xmlDoc.getElementsByTagName("modelo")[i].childNodes[0].nodeValue;
var precio = xmlDoc.getElementsByTagName("precio")[i].childNodes[0].nodeValue;
var cant = xmlDoc.getElementsByTagName("cantidad")[i].childNodes[0].nodeValue;
var det = xmlDoc.getElementsByTagName("detalle")[i].childNodes[0].nodeValue;
document.getElementById("id").innerHTML=id;
document.getElementById("marca").innerHTML=marca;
document.getElementById("modelo").innerHTML=modelo ;
document.getElementById("precio").innerHTML=precio ;
document.getElementById("cant").innerHTML=cant;
document.getElementById("det").innerHTML=det;
alert("Los datos son:\n\n"+id+"\n"+marca+"\n"+modelo+"\n"+precio+"\ n"+cant+"\n"+det);
}
}
PROCESO.PHP Código PHP:
<?php
header('Content-Type: text/xml');
echo "<?xml version=\"1.0\" ?>";
$con=mysql_connect("127.0.0.1","root","root") or die("error de conexion");
mysql_select_db("carrito") or die("esta db no existe");
$res=mysql_query("select * from productos limit 2") or die("error de consulta");
echo "<productos>";
for($i=0;$i < mysql_num_rows($res);$i++)
{
$fila=mysql_fetch_array($res);
echo"<producto>";
echo "<id>".$fila['id_producto']."</id>";
echo "<marca>".$fila['marca']."</marca>";
echo "<modelo>".$fila['modelo']."</modelo>";
echo "<precio>".$fila['precio']."</precio>";
echo "<cantidad>".$fila['cantidad']."</cantidad>";
echo "<detalle>".$fila['detalle']."</detalle>";
echo"</producto>";
}
echo "</productos>";
?>
::::::::::Mi problema es el siguiente::::::::::
Cuando cargo los datos en la tabla que se encuentra en el
"index.html", se sobreescriben los datos obtenidos.
Por ejemplo: Primer registro obtenido: id: 23
marca: amd
modelo: atlhon
precio: 200
cantidad: 5
detalle: xxxxxxxxxxx
Segundo registro obtenido: id: 30
marca: intel
modelo: i7
precio: 980
cantidad:10
detalle: XxXxXxXxXxXxXxX
Aqui me sobreescribe los datos del
Segundo registro obtenido sobre el
Primer registro obtenido. Es decir , solo puedo apreciar los siguientes datos:
id: 30
marca: intel
modelo: i7
precio: 980
cantidad:10
detalle: XxXxXxXxXxXxXxX ¿ Como puedo insertar los datos sin que me sobreescriba los datos ya recuperados ? En otras palabras lo que trato de hacer, se resume en esta imagen (deben sacar el espacio que se encuentra en h t t p : // w w w .) :
h t t p : // w w w .elrincondejavier.net/html/images/articulos
/Tabla%20de%20datos.jpg
Desde ya muchas gracias.... Espero su ayuda..