egyetem:webc2:ajax:f2:reszek6m
Tartalomjegyzék
| Tantárgy: | Webes rendszerek kliens oldali programozása 2. [IM3314, WP3316] | |
| Tananyag: | JavaScript - AJAX | |
| Feladat: | Település nevének keresése | |
| Kidolgozás: | Feladat megoldása fejlesztési részfeladatok segítségével | |
| Részfeladat: | 6. részfeladat | |
Részfeladat
Válasz XML feldolgozása
Részfeladat megoldásának forrása
// Város adat blokkok kiszűrése
var xmlDoc=xmlhttp.responseXML.getElementsByTagName("town");
// Több városadat esetében lista összeállítása
var txt="";
for(var i=0;i<xmlDoc.length;i++)
if(xmlDoc[i].nodeType){
var xmlDocPostCode=xmlDoc[i].getElementsByTagName("postcode");
var xmlDocName=xmlDoc[i].getElementsByTagName("name");
txt+=xmlDocPostCode[0].firstChild.nodeValue+" "+xmlDocName[0].firstChild.nodeValue+"<br/>";
}
Megoldás forráskódja
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Település nevének keresése - 6</title>
<meta name="author" content="Tóth Péter" />
<meta name="copyright" content="© 2012, NYME SEK" />
<meta http-equiv="date" content="2012-09-19" />
<meta name="revised" content="Tóth Péter, 19/09/2012" />
<meta name="description" content="JavaScript - AJAX - Település nevének keresése" />
<meta http-equiv="content-language" content="hu" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script type="text/javascript">
<!--
function funcLoadTown(){
// Település részlet betöltése
var sVaros=document.getElementById("idTelepules").value;
// AJAX hívás előkészítése
if(window.XMLHttpRequest)
xmlhttp=new XMLHttpRequest();
else
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
// Kezelő php program beállítása és paramézterezése
xmlhttp.open("GET","http://tptg.hu/egyetem/webc2/ajax_gettown.php?town="+sVaros,true);
// Válasz lekezelése
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
// Város adat blokkok kiszűrése
var xmlDoc=xmlhttp.responseXML.getElementsByTagName("town");
// Több városadat esetében lista összeállítása
var txt="";
for(var i=0;i<xmlDoc.length;i++)
if(xmlDoc[i].nodeType){
var xmlDocPostCode=xmlDoc[i].getElementsByTagName("postcode");
var xmlDocName=xmlDoc[i].getElementsByTagName("name");
txt+=xmlDocPostCode[0].firstChild.nodeValue+" "+xmlDocName[0].firstChild.nodeValue+"<br/>";
}
}
}
// Szükségeas header beállítás
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
// AJAX hívás
xmlhttp.send();
}
-->
</script>
</head>
<body>
<div>
Település nevének részlete: <input id="idTelepules" size="20" onkeyup="javascript:funcLoadTown()"/>
</div>
</body>
</html>
egyetem/webc2/ajax/f2/reszek6m.txt · legutóbbi módosítás: – Szerkesztő: peter
