Cómo mostrar una tabla en HTML usando Ajax

Ajax trabaja con tablas HTML y datos XML para mostrar una lista de registros para sus lectores web. En lugar de definir cada elemento HTML, Ajax le permite llamar a funciones de tabla para mostrar registros en filas y columnas sin escribir el código para los elementos de la tabla. Ajax recorre cada elemento de datos desde XML y elige si mostrar u ocultar los datos.

1.

Haga clic con el botón derecho en el archivo HTML o Ajax que desea usar para mostrar la tabla. Abra el archivo XML que desea usar para recuperar los datos de la tabla. La siguiente declaración de Ajax abre un archivo XML con una lista de clientes:

nueva Ajax.Request ('clientes.xml', {método: 'obtener', onSuccess: función (transporte)}

2.

Obtenga una lista de etiquetas y los datos de las etiquetas. El siguiente código Ajax carga los datos que utiliza para recorrer y crear la tabla:

var clients = transport.responseXML.getElementsByTagName ('cliente');

3.

Cree el bucle "para" que recorre cada elemento XML. El siguiente código muestra cómo configurar un bucle "para" en Ajax:

para (var i = 0; i <Customers.length; i ++) {}

4.

Crea una fila de tabla y una celda para mostrar tus datos. El siguiente código crea las variables de fila y celda que configuran la estructura de la tabla:

var row = $ ('clientes'). insertRow (-1); var cell = row.insertCell (-1);

5.

Agregue los datos a la celda de la tabla. El siguiente código agrega el nombre del cliente a la celda:

cell.innerHTML = cliente;

Entradas Populares