Php Ajax e Xml

Neste artigo, demonstraremos como você pode criar aplicações web dinâmicas usando PHP AJAX e XML . Ao longo do artigo, forneceremos exemplos da vida real e instruções passo a passo para ajudá-lo a começar.

Ao combinar AJAX e XML, você pode criar uma experiência de usuário poderosa que atualiza dados de forma contínua, como notícias, imagens e vídeos, em uma página da Web sem exigir o recarregamento de página inteira. O AJAX permite a comunicação assíncrona entre o cliente e o servidor, enquanto o XML é usado como uma linguagem de marcação para armazenar e transportar dados.



Php Ajax e Xml

A combinação de Php Ajax e Xml pode criar aplicativos da Web poderosos que podem atualizar dados na página sem recarregar a página inteira. Com AJAX , você pode fazer solicitações assíncronas ao servidor e, com XML, pode transportar e manipular dados com facilidade.

Com o uso de AJAX, o exemplo a seguir demonstrará como as informações de um arquivo XML podem ser renderizadas em uma página da Web:

Exemplo de Explicação

Assim que um usuário escolher um livro na lista suspensa acima, uma função chamada showBooks()  será chamada e executada.

Esta função é chamada quando o evento “ onchange ” é acionado:

Example: 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<html>
<head>
<script>
function showBooks(str) {
if (str == "") {
document.getElementById("bookHint").innerHTML = "";
return;
}
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 & this.status == 200) {
document.getElementById("bookHint").innerHTML = this.responseText;
}
}
xmlhttp.open("GET", "getBookCatalog.php?b=" + str, true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
Select a Book:
<?php
$optionsXML = simplexml_load_file("bookCatalog.xml");
$options = $optionsXML->xpath("//catalog/book/title");
echo '<select name="book" onchange="showBooks(this.value)">';
echo '<option value="">Select a CD:</option>';
foreach ($options as $key => $value) {
echo '<option>' . $value . '</option>';
}
echo '</select>';
?>
</select>
</form>
<div id="bookHint"><b>Books info will be listed here…</b></div>
</body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
Há uma série de coisas que showbooks() faz:
  • Certifique-se de que um livro esteja selecionado.
  • Crie uma nova instância de XMLHttpRequest.
  • Você precisará criar uma função que será executada quando a resposta do servidor estiver pronta.
  • Coloque a solicitação em um arquivo do servidor.
  • A URL tem um parâmetro (b) adicionado que contém o conteúdo da lista suspensa.

O Arquivo PHP

Um arquivo PHP denominado getBookCatalog.php  é chamado pelo JavaScript acima no servidor para exibir o catálogo de livros na página.

Um documento XML, bookCatalog.xml , é carregado no script PHP e uma consulta é executada nele, levando ao retorno de um documento HTML .

Example: 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE html>
<html>
<head>
<style>
table {
width: 100%;
border-collapse: collapse;
}
table,
td,
th {
border: 1px solid black;
padding: 5px;
}
th {
text-align: left;
}
</style>
</head>
<body>
<?php
$b = $_GET["b"];
$xmlDoc = new DOMDocument();
$xmlDoc->load("bookCatalog.xml");
$x = $xmlDoc->getElementsByTagName('title');
for ($i = 0; $i <= $x->length 1; $i++) {
//Process only element nodes
if ($x->item($i)->nodeType == 1) {
if ($x->item($i)->childNodes->item(0)->nodeValue == $b) {
$y = ($x->item($i)->parentNode);
}
}
}
$book = ($y->childNodes);
echo "<table>";
echo "<tr>";
echo ("<th> Author </th>");
echo ("<th> Title </th>");
echo ("<th> Genre </th>");
echo ("<th> Price </th>");
echo ("<th> Publish_Date </th>");
echo ("<th> description </th>");
echo "</tr>";
echo ("<tr>");
for ($i = 0; $i < $book->length; $i++) {
//Process only element nodes
if ($book->item($i)->nodeType == 1) {
echo ("<td> " . $book->item($i)->childNodes->item(0)->nodeValue . " </td>");
echo (" ");
}
}
echo ("</tr>");
echo "</table>";
?>
</body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Exemplo de Explicação

O código fornecido é um exemplo de uso do PHP para analisar um arquivo XML e exibir os dados em uma tabela HTML. Quando um usuário insere um título como parâmetro na URL, o código procura o livro correspondente no arquivo XML e exibe seus detalhes em uma tabela.

Como um grupo, primeiro definimos o estilo HTML para a tabela usando CSS na seção head . O estilo define uma tabela com largura de 100% e bordas recolhidas. A tabela, as células da tabela ( td ) e os cabeçalhos da tabela ( th ) têm uma borda preta de 1px e um preenchimento de 5px. As células do cabeçalho da tabela são alinhadas à esquerda.

Em seguida, usamos o PHP para obter o valor do parâmetro “b” da string de consulta da URL usando o $_GET superglobal. Em seguida, criamos um novo objeto DOMDocument e carregamos o arquivo “bookCatalog.xml”.

Usamos o método getElementsByTagName para obter todos os elementos do título no arquivo XML. Em seguida, percorremos cada elemento de título e verificamos se seu valor corresponde à entrada do usuário. Se encontrarmos uma correspondência, obteremos o nó pai ( $y ) do elemento de título.

Em seguida, obtemos os nós filhos de $y que contêm os detalhes do livro. Em seguida, criamos uma tabela HTML com uma linha de cabeçalho contendo os nomes das colunas: Autor, Título, Gênero, Preço, Data_Publicação e descrição.

Em seguida, percorremos os nós filhos de $y e exibimos o valor de cada nó em uma célula de tabela separada. Por fim, fechamos a linha da tabela e as tags da tabela.

Se nenhum livro corresponder à entrada do usuário, a tabela estará vazia.


Guia passo a passo para usar PHP AJAX e XML juntos

  1. Crie um script PHP que manipulará a solicitação AJAX. Esse script deve receber a solicitação, processar os dados e retornar o resultado para o JavaScript do lado do cliente.
  2. Use o objeto XMLHttpRequest em JavaScript para fazer uma solicitação AJAX para o script PHP.
  3. No script PHP, use SimpleXML para ler e manipular os dados XML.
  4. Devolva os dados manipulados de volta ao JavaScript do lado do cliente.
  5. Atualize a página com os novos dados usando JavaScript.

Vantagens PHP AJAX e XML

  • Com AJAX, apenas os dados necessários são solicitados ao servidor, o que pode resultar em tempos de carregamento mais rápidos.
  • O AJAX permite que o conteúdo seja atualizado em uma página sem recarregar a página inteira, criando uma experiência de usuário mais suave e interativa.
  • Com SimpleXML, os dados XML podem ser facilmente analisados ​​e manipulados em PHP.

Conclusão

Usar PHP AJAX e XML juntos pode criar aplicativos da web poderosos e dinâmicos. Seguindo o guia passo a passo descrito neste artigo, você pode criar aplicativos da Web que atualizam o conteúdo em tempo real sem precisar recarregar a página inteira. Com AJAX e XML, você pode criar uma experiência de usuário mais envolvente e eficiente para os visitantes do seu site .

Se gostou deste artigo e o achou informativo, pode subscrever a nossa newsletter abaixo.

Nós valorizamos o seu feedback.
+1
0
+1
0
+1
0
+1
0
+1
0
+1
0
+1
0

Assine a nossa newsletter
Digite seu e-mail para receber um resumo semanal de nossos melhores posts. Saber mais!
ícone