Inserting an XML node using Javascript

Question

I seem to be stuck in implementing an "XML data insert using Javascript".

My application is an asp.net with asp.net AJAX.

My XML document is as follows:

<?xml version="1.0" encoding="utf-8" ?>
<hotels>
    <hotel supplier="Sarova panafric" id="HTL-10001">
        <supplier>Sarova panafric</supplier>
        <contact>Mr S Njoroge</contact>
        <tel>75-525254</tel>
    </hotel>
    <hotel supplier="Sarova mara" id="HTL-10002">
        <supplier>Sarova mara</supplier>
        <contact>Mr ole seni</contact>
        <tel>20-54574</tel>
    </hotel>
</hotels>

This is the JavaScript function I use to try and insert data in my XML file:

function addhotels() {
    var xml;
    if (window.ActiveXObject) {
        xml = new ActiveXObject("Microsoft.XMLHTTP");
    } else {
        xml = new XMLHttpRequest();
    }
    xml.open("GET", "hotelRates.xml", true);
    xml.send(null);

    var hotel = xml.responseXML.createElement("hotel");

    var supplier = xml.responseXML.createElement("supplier");
    supplier.appendChild(xml.responseXML.createTextNode("Sarova stanley"));

    var contact = xml.responseXML.createElement("contact");
    contact.appendChild(xml.responseXML.createTextNode("Mr Njoroge"));

    var tel = xml.responseXML.createElement("tel");
    tel.appendChild(xml.responseXML.createTextNode("21454741"));

    hotel.appendChild(supplier);
    hotel.appendChild(contact);
    hotel.appendChild(tel);
    xml.responseXML.appendChild(hotel);
}

The XML file is sitting on the root folder of my project, where pages are located.

I don't know why it doesn't work.

============================== I have now changed the code as follows, but still no effect.

function addhotels() {
    var xml;
    if (window.ActiveXObject) {
        xml = new ActiveXObject("Microsoft.XMLHTTP");
    } else {
        xml = new XMLHttpRequest();
    }
    xml.open("GET", "hotelRates.xml", true);
    xml.send(null);

    var hotels = xml.responseXML.createElement("hotels");

    var supplier = xml.responseXML.createElement("supplier");
    supplier.appendChild(xml.responseXML.createTextNode("Sarova stanley"));

    var contact = xml.responseXML.createElement("contact");
    contact.appendChild(xml.responseXML.createTextNode("Mr Njoroge"));

    var tel = xml.responseXML.createElement("tel");
    tel.appendChild(xml.responseXML.createTextNode("21454741"));

    hotels.appendChild(supplier);
    hotels.appendChild(contact);
    hotels.appendChild(tel);
    xml.responseXML.appendChild(hotels); 
}

You are still doing xml.responseXML.appendChild. You cannot append to the document itself, as mentioned in both answers below. — Wayne
– Wayne, Commented Dec 14, 2011 at 23:54

Wayne · Accepted Answer · 2011-12-14 23:52:46Z

You're currently invoking send and then expecting the response to be immediately available. This is fundamentally wrong. The third argument to xml.open (true) indicates that you want the request to be executed asynchronously. You need to handle the response in an xml.onreadystatechange callback:

function addhotels() {
    var xml;
    if (window.ActiveXObject) {
        xml = new ActiveXObject("Microsoft.XMLHTTP");
    } else {
        xml = new XMLHttpRequest();
    }
    xml.onreadystatechange = function() {
        if (xml.readyState == 4 && xml.status == 200) {
            var resp = xml.responseXML;
            var hotel = xml.responseXML.createElement("hotel");

            var supplier = xml.responseXML.createElement("supplier");
            supplier.appendChild(xml.responseXML
                    .createTextNode("Sarova stanley"));

            var contact = xml.responseXML.createElement("contact");
            contact.appendChild(xml.responseXML.createTextNode("Mr Njoroge"));

            var tel = xml.responseXML.createElement("tel");
            tel.appendChild(xml.responseXML.createTextNode("21454741"));

            hotel.appendChild(supplier);
            hotel.appendChild(contact);
            hotel.appendChild(tel);
            xml.responseXML.documentElement.appendChild(hotel);
        }
    }
    xml.open("GET", "hotelRates.xml", true);
    xml.send(null);
}

Note that I also changed xml.responseXML.appendChild to xml.responseXML.documentElement.appendChild as pointed out by @Dr.Molle. You can't append to the document itself.

Dr.Molle · Accepted Answer · 2011-12-14 20:30:19Z

1

Try

xml.responseXML.documentElement.appendChild(hotel);

Currently you append the node to the document, what is an illegal operation because an XML-document may only have 1 root-element.
xml.responseXML.documentElement points to the root-element(<hotels/>)

answered Dec 14, 2011 at 20:30

Dr.Molle

117k16 gold badges200 silver badges206 bronze badges

2 Comments

Pointy Over a year ago

A big problem is going to be the fact that he's launching an asynchronous request and then expecting the response to be ready immediately ...

Dr.Molle Over a year ago

Oh yes, I didn't look at this. But when he will fix that he must consider my answer.

shamilsdq · Accepted Answer · 2014-03-22 18:37:28Z

0

I would say that you are not saving the changes made. You need to save it to the XML file. You could first take the response XML as variable xmldoc, then add the new data into it and at last write- xmldoc.save("hotelrates.xml");

answered Mar 22, 2014 at 18:37

shamilsdq

11 bronze badge

Collectives™ on Stack Overflow

Inserting an XML node using Javascript

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related