AJAX XML

<html>
<head>
<script src="vyomselected.js"></script>
</head>
<body>
<form>
Select a CD:
<select name="cds" onchange="showCD(this.value)">
<option value="Bob Dylan">Bob Dylan</option>
<option value="Bonnie Tyler">Bonnie Tyler</option>
<option value="Dolly Parton">Dolly Parton</option>
</select>
</form>
<p>
<div id="txtHint"><b>CD info will be listed here.</b></div>
</p>
</body>
</html>

Como você pode ver é justo um formulário simples do HTML com uma gota simples encaixota para baixo o “Cd chamado”

O parágrafo abaixo do formulário contem um Tag do div chamado “txtHint”. O div é usado como um placeholder para a informação recuperada do web server.

Quando os dados seletos do usuário, uma função chamada “showCD” forem executados. A execução da função é provocada pelo evento do “onchange” do Javascript. Em outras palavras: Cada vez que a mudança do usuário o valor da gota na caixa do menu para baixo, o showCD da função é chamada.

O código do Javascript é dado abaixo

O Javascript de AJAX

Este é o código do Javascript armazenado na lima “vyomselected.js”:

var xmlHttp

function showCustomer(str)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="getcustomer.asp"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText
}
}

function GetXmlHttpObject()
{
var objXMLHttp=null
if (window.XMLHttpRequest)
{ objXMLHttp=new XMLHttpRequest()
}
else if (window.ActiveXObject)
{
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
}
return objXMLHttp
}

A página do usuário de AJAX

O usuário paginou chamado pelo Javascript, é uma lima simples do ASP que tem o nome “getvyomcd1.asp”

A página é escrita em VBScript para o usuário de informação do Internet (IIS). Poderia fàcilmente ser reescrita em PHP, ou em algumas outras línguas do usuário.

O código funciona uma pergunta de encontro a uma lima de XML e retorna o resultado como o formato do HTML.

q=request.querystring("q")

set xmlDoc=Server.CreateObject("Microsoft.XMLDOM")
xmlDoc.async="false"
xmlDoc.load(Server.MapPath("cd_catalog.xml"))

set nodes=xmlDoc.selectNodes("CATALOG/CD[ARTIST='" & q & "']")

for each x in nodes
for each y in x.childnodes
response.write("<b>" & y.nodename & ":</b> ")
response.write(y.text)
response.write("<br />")
next
next