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

15 comments:

  1. AnonymousJuly 13, 2009 at 9:21 AM

    why its not working on mozilla?

    ReplyDelete
  2. AnonymousOctober 30, 2009 at 8:00 AM

    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. AnonymousFebruary 13, 2010 at 3:13 AM

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

    ReplyDelete
  4. girishgJuly 22, 2010 at 4:07 AM

    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. AnonymousAugust 14, 2010 at 7:28 AM

    yes, it still doesnt work in firefox

    ReplyDelete
  6. AnonymousNovember 2, 2010 at 12:35 PM

    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. AnonymousJanuary 10, 2011 at 11:36 AM

    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. AnonymousFebruary 28, 2011 at 6:44 AM

    code is not working on mozilla

    ReplyDelete
  9. UnknownMay 19, 2011 at 7:17 AM

    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. AnonymousJune 28, 2011 at 2:59 AM

    its not working in neither of browsers....wat might be the problem??plzz reply me to my emailid johnterry102010@hotmail.com

    ReplyDelete
  11. AnonymousJuly 8, 2011 at 12:17 AM

    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
  12. somuNovember 7, 2011 at 1:34 AM

    Thank you

    ReplyDelete
  13. somuNovember 7, 2011 at 1:45 AM

    Thank you dude

    ReplyDelete
  14. AnonymousJuly 16, 2012 at 10:28 AM

    thanks you man .... you saved my life :) just the thing I was looking for ..

    ReplyDelete
  15. phpApril 12, 2014 at 1:06 AM

    Very nice.Please keep visit this blog for good tutorial on Java.

    ReplyDelete

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

Subscribe to: Post Comments (Atom)