Como exibir uma tabela em HTML usando o Ajax

O Ajax trabalha com tabelas HTML e dados XML para exibir uma lista de registros para seus leitores da Web. Em vez de definir cada elemento HTML, o Ajax permite chamar funções de tabela para exibir registros em linhas e colunas sem escrever o código dos elementos da tabela. O Ajax percorre cada item de dados do XML e você escolhe se deseja exibir ou ocultar os dados.

1

Clique com o botão direito do mouse no arquivo HTML ou Ajax que você deseja usar para exibir a tabela. Abra o arquivo XML que você deseja usar para recuperar os dados da tabela. A seguinte instrução do Ajax abre um arquivo XML com uma lista de clientes:

novo Ajax.Request ('customers.xml', {método: 'get', onSuccess: function (transport)}

2

Obtenha uma lista de tags e os dados das tags. O código Ajax a seguir carrega os dados que você usa para percorrer e criar a tabela:

var customers = transport.responseXML.getElementsByTagName ('customer');

3

Crie o loop "for" que itera em cada elemento XML. O código a seguir mostra como configurar um loop "for" no Ajax:

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

4

Crie uma linha e uma célula da tabela para exibir seus dados. O código a seguir cria as variáveis ​​de linha e célula que configuram a estrutura da tabela:

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

5

Adicione os dados à célula da tabela. O código a seguir adiciona o nome do cliente à célula:

cell.innerHTML = cliente;

Publicações Populares