AJAX (अजॅक्स) भाग-४

Written by Administrator

भाग ३ मध्ये   अजॅक्सच्या xmlhttp.responseText या फंक्शनचा उपयोग करून साहाय्याने foundation_websites.txt या फाईलमधील मजकूर सर्व्हरवरून घेऊन  वेबपेजमधील योग्य त्याठिकाणी ही माहिती कशी दाखविता येईल हे आपण पाहिले. मात्र अशा माहितीतील आवश्यक तेवढाच भाग म्हणजे एखाद्या विशिष्ट वेबसाईटचे नाव दाखवायचे असेल तर responseText चा वापर करता येत नाही.
 सर्व्हरवरील माहिती xml प्रकारच्या फाईलमध्ये असेल तर xmlhttp.responseXML चा उपयोग करून माहितीतील आवश्यक  भाग  निवडून तो वेबपेजमध्ये दाखविणे शक्य होते. यासाठी xmlhttp.responseXMLच्या getElementsByTagName या  गुणविशेषाचा (प्रॉपर्टीचा) वापर करावा लागतो.
उदाहरणार्थ  खाली foundation_websites.xml या फाईलमधील माहिती दाखविली आहे. 
<?xml version="1.0" ?>
    <Websites>
        <Website>
        <name>www.dnyandeep.net</name>
        <description>Dnyandeep Foundation main  website</description>
        </Website>
        <Website><name>www.mymarathi.com</name>
        <description>Marathi literature and Maharashtra information in Marathi</description>
        </Website>
        <Website><name>www.sanskritdeepika.org</name>
        <description>Sanskrit Dictionary, Grammar with audio clips </description>
        </Website>
        <Website><name>www.vidnyan.net</name>
        <description>Science Education  in Marathi</description>
        </Website>
        <Website><name>www.mysangli.com</name>
        <description>Sangli informationa portal  in Marathi</description>
        </Website>
        <Website><name>www.mykolhapur.net</name>
        <description>Kolhapur informationa portal  in Marathi</description>
        </Website>
        <Website><name>www.envis.org</name>
        <description>Environmental Education and Awareness</description>
        </Website>
        <Website><name>www.green-tech.biz</name>
        <description>Green Technology Seminars and Workshops Information</description>
        </Website>
        <Website><name>www.school4all.org</name>
        <description>All subjects education at school level   in Marathi</description>
        </Website>
        <Website><name>www.mykolhapurilive.com</name>
        <description>First video based news portal for Kolhapur district</description>
        </Website>
    </Websites>
-----
वरील XML फाईलमधील सर्व माहिती तक्त्याच्या स्वरुपात दाखविण्यासाठी खालील प्रोग्रॅम लिहिला आहे.
---- 
<!DOCTYPE html>
<html>
<head>
<script>
function loadXMLDoc(url)
{
var xmlhttp;
var txt,x,xx,i;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    txt="<table border='1'><tr><th>Name</th><th>Description</th></tr>";
    x=xmlhttp.responseXML.documentElement.getElementsByTagName("Website");
    for (i=0;i<x.length;i++)
      {
      txt=txt + "<tr>";
      xx=x[i].getElementsByTagName("name");
        {
        try
          {
          txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
          }
        catch (er)
          {
          txt=txt + "<td> </td>";
          }
        }
      xx=x[i].getElementsByTagName("description");
        {
        try
          {
          txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
          }
        catch (er)
          {
          txt=txt + "<td> </td>";
          }
        }
         
      txt=txt + "</tr>";
      }
    txt=txt + "</table>";
    document.getElementById('txtCDInfo').innerHTML=txt;
    }
  }
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
</script>
</head>
<body>

<div id="txtCDInfo">
<button onClick="loadXMLDoc('foundation_websites.xml')">Get Website info</button>
</div>

</body>
</html>
--------
त्याचे उत्तर असे येईल.

 
आता या तक्त्यातील मधल्या दोन ओळीच ( पाचवी व सहावी - येथे i शून्यपासून सुरू होतो हे लक्षात ठेवले पाहिजे. म्हणजे i=4 व i=5 ) फक्त दाखवायच्या असल्यास प्रोग्रॅममध्ये खालील बदल करावा लागेल.
  for (i=4;i<6;i++)
त्याचे उत्तर असे येईल.