Hola a amigos: 
Estoy desarrollando un pagina, y nesecito traer todos los productos de la base de datos.
La tabla de productos posee los siguientes atributos: 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.
::::::::::Mi problema es el siguiente::::::::::
Cuando cargo los datos en la tabla que se encuentra en el "index.html", se sobreescriben los datos obtenidos,
es decir, si tengo dato 1, luego es sobreescrito o tapado por dato 2, y dato 2 sera tapado o sobreescrito por dato 3, y asi sucesivamente.
¿ Como puedo insertar los datos sin que me sobreescriba los datos ya recuperados ?
Esta imagen es un resumen de lo que trato de hacer :
elrincondejavier.net/html/images/articulos
/Tabla%20de%20datos.jpg Códigos 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>
javascript (Ajax) Código HTML:
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;
}
ajax=getXMLHTTPRequest();
function processData()
{
ajax.open("GET","proceso.php",true);
ajax.onreadystatechange=function(){
if(ajax.readyState==4)
{
if(ajax.status == 200)
{
var dato = ajax.getElementsByTagName("id");
for(var i=0; i < dato.length; i++)
{
var id = ajax.getElementsByTagName("id")[i].childNodes[0].nodeValue;
var marca = ajax.getElementsByTagName("marca")[i].childNodes[0].nodeValue;
var modelo = ajax.getElementsByTagName("modelo")[i].childNodes[0].nodeValue;
var precio = ajax.getElementsByTagName("precio")[i].childNodes[0].nodeValue;
var cant = ajax.getElementsByTagName("cantidad")[i].childNodes[0].nodeValue;
var det = ajax.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;
}//cierra for.-
}//cierra status==200.-
}//cierra onreadyState==4.-
};
ajax.send(null);
}//cierra funcion processData.-
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>";
?>
