Foros del Web » Programando para Internet » Javascript » Frameworks JS »

mostrar una tabla con todos los registros

Estas en el tema de mostrar una tabla con todos los registros en el foro de Frameworks JS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 17/05/2009, 23:27
 
Fecha de Ingreso: agosto-2007
Ubicación: guadalajara
Mensajes: 32
Antigüedad: 16 años, 8 meses
Puntos: 0
Exclamación mostrar una tabla con todos los registros

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>";
?>

  #2 (permalink)  
Antiguo 18/05/2009, 08:31
Avatar de GatorV
$this->role('moderador');
 
Fecha de Ingreso: mayo-2006
Ubicación: /home/ams/
Mensajes: 38.567
Antigüedad: 18 años
Puntos: 2135
Respuesta: mostrar una tabla con todos los registros

Te los sobre-escribe porque estas reasignando lo que esta en los nodos, para hacer lo que necesitas, debes de crear otra fila dinamicamente, ve este ejemplo:
Código javascript:
Ver original
  1. <script type="text/javascript">
  2. function addRow() {
  3.        var table = document.getElementById("test");
  4.        var numRows = table.getElementsByTagName("tr").length;
  5.        var row = table.insertRow(numRows);
  6.        var cell = row.insertCell(0);
  7.        cell.innerHTML = "foo " + numRows;
  8. }
  9. </script>
  10. <table id="test">
  11.       <tr>
  12.            <th>test</th>
  13.       <tr>
  14.       <tr>
  15.            <td>foo</td>
  16.       </tr>
  17. </table>
  18.  
  19. <input type="button" name="addRow" value="agregar fila" onclick="addRow();" />
  #3 (permalink)  
Antiguo 20/05/2009, 01:01
 
Fecha de Ingreso: mayo-2009
Mensajes: 40
Antigüedad: 15 años
Puntos: 0
De acuerdo Respuesta: mostrar una tabla con todos los registros

tambien puede usar este codigo que yo hice para hacer lo mismo, para ver una tabla con un listado de usuarios registrados, al caso lo mismo

-----------------------------------------------------------------------------------------------
listado.php
-----------------------------------------------------------------------------------------------

Código PHP:
<HTML>
<HEAD>
<TITLE>lectura.php</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">body,td,th {
    color: #FFFFFF;
}
body {
    background-image: url(images/fondo.jpg);
    background-repeat: repeat;
}
</style></HEAD>
<BODY>
<div align="center">
<h1>Listado de Registros</h1>
<br>
<br>
<?
//Conexion con la base
mysql_connect("host""usuario","clave");
mysql_select_db("base_datos");

//Ejecutamos la sentencia SQL
$result=mysql_query("select * from `tabla`");
?>
<table width="2628" border="1" align="center" cellpadding="1" cellspacing="1" bordercolor="#FFFFFF">
<tr>
<th width="43" align="center" valign="middle">ID</th>

<th width="102" align="center" valign="middle">Nombre del participante</th>
<th width="122" align="center" valign="middle">Apellidos del participante</th>
<th width="112" align="center" valign="middle">NIF del participante</th>
<th width="122" align="center" valign="middle">tel&eacute;fono del participante</th>
<th width="117" align="center" valign="middle">M&oacute;vil del participante</th>
<th width="117" align="center" valign="middle">Email del participante</th>
<th width="101" align="center" valign="middle">D&iacute;a de nacimiento</th>
<th width="104" align="center" valign="middle">Mes de nacimiento</th>
<th width="102" align="center" valign="middle">Año de nacimiento</th>

<th width="95" align="center" valign="middle">Nombre de la pareja</th>
<th width="105" align="center" valign="middle">Apellidos de la pareja</th>
<th width="73" align="center" valign="middle">NIF de la pareja</th>
<th width="95" align="center" valign="middle">tel&eacute;fono de la pareja</th>
<th width="79" align="center" valign="middle">M&oacute;vil de la pareja</th>
<th width="76" align="center" valign="middle">Email de la pareja</th>
<th width="101" align="center" valign="middle">D&iacute;a de nacimiento</th>
<th width="104" align="center" valign="middle">Mes de nacimiento</th>
<th width="102" align="center" valign="middle">Año de nacimiento</th>

<th width="100" align="center" valign="middle">Direcci&oacute;n de env&iacute;o</th>
<th width="88" align="center" valign="middle">N&uacute;mero de env&iacute;o</th>
<th width="60" align="center" valign="middle">Piso de env&iacute;o</th>
<th width="76" align="center" valign="middle">Puerta de env&iacute;o</th>
<th width="98" align="center" valign="middle">Provincia de env&iacute;o</th>
<th width="100" align="center" valign="middle">Poblaci&oacute;n de env&iacute;o</th>
<th width="74" align="center" valign="middle">C.P. de env&iacute;o</th>

</tr>
<?
//Mostramos los registros
while ($row=mysql_fetch_array($result))
{
echo 
'<tr><td align="center" valign="middle">'.$row["id"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["nom_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["ape_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["dni_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["tel_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["mov_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["mail_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["dd_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["mm_par"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["aa_par"].'</td>';

echo 
'<td align="center" valign="middle">'.$row["nom_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["ape_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["dni_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["tel_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["mov_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["mail_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["dd_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["mm_par2"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["aa_par2"].'</td>';

echo 
'<td align="center" valign="middle">'.$row["dir_cup"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["num_cup"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["pis_cup"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["puer_cup"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["prov_cup"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["pobl_cup"].'</td>';
echo 
'<td align="center" valign="middle">'.$row["cp_cup"].'</td>';


}
mysql_free_result($result)
?>
</tr>
</table>
</div>
</BODY>
</HTML>
-------------------------------------------------------------------------------------------------------
lo puede poner en un iframe si kieres para no tener k cambiar mucho la web que tenias exa.

un saludo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 02:32.