Monday, May 18, 2009

Parse XML file in JavaScript part 2

As one of reader asked about how to handle XML respone if we get more than records or if your XML file have many child nodes.
I gave here one complete example with XML file and JavaScript in JSP.

1. abc.xml

<Students>
<Student>
<Name>Binod Kumar Suman</Name>
<Hostel>Ganga</Hostel>
<Contact>999999999</Contact>
</Student>

<Student> <Name>Pramod Kumar Modi</Name>
<Hostel>Godawari</Hostel>
<Contact>88888888</Contact>
</Student>

<Student>
<Name>Sanjay Kumar</Name>
<Hostel>Satjal</Hostel>
<Contact>7777777</Contact>
</Student>

<Student>
<Name>Mukesh Ambani</Name>
<Hostel>Rewti</Hostel>
<Contact>6666666</Contact>
</Student>

</Students>

2. StudentInfo.jsp

<html><head><title>Binod Java Solution AJAX </title>
<script type="text/javascript">

function showResult(){

var xmlDoc=new ActiveXObject("MSXML.DOMDocument");
xmlDoc.async="false"; xmlDoc.load("abc.xml");
var students=xmlDoc.documentElement;
var student = students.childNodes(0);
var rows = students.childNodes.length; v
ar cols = student.childNodes.length;

var body = document.getElementsByTagName("body")[0];
//var tabl = document.createElement("table");
var tabl = document.getElementById("studentinfo");
var tblBody = document.createElement("tbody");

for (var i = 0; i < rows; i++) {
var row = document.createElement("tr");
student = students.childNodes(i);

for (var j = 0; j < cols; j++) {
var cell = document.createElement("td");
var cellText = document.createTextNode(student.childNodes(j).firstChild.text); cell.appendChild(cellText);
row.appendChild(cell);
}

tblBody.appendChild(row);
tabl.appendChild(tblBody);
tabl.setAttribute("border", "2");
}

</script>

</head><body onload="showResult()">
<h2> GET STUDENT INFO </h2><br>

<table id="studentinfo"> <tr bgcolor='red'> <td >Name</td><td>Hostel</td><td>Contact</td> </tr> </table>
</body>
</html>

Now your html table will grow dynamically as per number of records in XML file.
Posted by Binod Suman at 11:19 AM
Reactions: 

12 comments:

  1. why its not working on mozilla?

    ReplyDelete

  2. there is parse error in your file.
    Line 10 (there is a "v" at the end which is supposed to be "var" in the following line) and
    i had to put a "}" just before the "/script" tag to get the thing working. Thank you anyway.

    ReplyDelete

  3. I fixed everything according to previuos post, but it still doesn't work in Firefox

    ReplyDelete

  4. if (window.XMLHttpRequest) { // Mozilla, Safari, ...
    httpRequest = new XMLHttpRequest();
    } else if (window.ActiveXObject) { // IE
    httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
    }

    probably because of this try it
    -Giri

    ReplyDelete

  5. yes, it still doesnt work in firefox

    ReplyDelete

  6. That's because this line:

    var xmlDoc=new ActiveXObject("MSXML.DOMDocument");

    is specific for IE. For non-IE browsers you probably want to use the DOM Parser:

    http://www.w3schools.com/dom/dom_parser.asp

    ReplyDelete

  7. Thanks, your article helped me a lot - I now more or less understand how to carry on with XML and Javascript. Good job!

    ReplyDelete

  8. code is not working on mozilla

    ReplyDelete

  9. function GetXmlHttpObject() {
    var xmlHttp = null;
    try {
    // Firefox, Opera 8.0+, Safari
    xmlHttp = new XMLHttpRequest();
    } catch (e) {
    // Internet Explorer
    try {
    xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    }

    return xmlHttp;
    }

    ReplyDelete

  10. this code isn't working in any of my browsers i donno wat is the problem ...please get me out of this problem ....plzz

    ReplyDelete

You can put your comments here (Either feedback or your Question related to blog)

Subscribe to: Post Comments (Atom)