getElementById() is not working after modifying the SVG Document

Question

I have a SVG document; say as below:

<svg>
   <g ...>
      <rect id="perm1" ../>
      <rect id="temp1" ../>
</svg>

in the run-time, I am changing the id of the second 'rect' from 'temp1' to 'calc_id1' using java script functions (see below); but immediately after modifying it, I am calling another function in which I am trying to retrieve the rect element using getElementById() with the new id 'calc_id1'; but it is returning null. I am not sure, what's wrong here but I can confirm that the rect element is updated with the new id. Any clue or answer will be of great help to me.

Please note that I am using IE9.

changeID( xmlDoc, "//g[@id='temp1']", "calc_id1");

function changeID( xmlDoc, xPath, newIdValue ) {
    var node = xmlDoc.selectSingleNode(xPath);
    if (node!=null){
            var oAttr = node.attributes.getNamedItem( "id");
            if (oAttr!=null){
                 oAttr.text = newIdValue;
            }
            return node;
    }
    else {
            return null;
    }
}

Please add the javascript code snippet that sets the id, just to confirm that there's nothing wrong with that bit. — Erik Dahlström, Feb 11 '12 at 13:40
I think there should be a typo error. It should have been changeID( xmlDoc, "//rect[@id='temp1']", "calc_id1"); — Rajkamal Subramanian, Feb 13 '12 at 06:21
thats typo in the question, in the actual code, I do have it as "//rect[id]='temp1']". I could get all the elements using getElementsByTagName() and filter the list by 'id' attribute! probably a bug in IE9! — Venkatesh Laguduva, Feb 13 '12 at 15:08
http://stackoverflow.com/questions/8065229/firefox-svg-getelementbyidid — dr jerry, Feb 13 '12 at 16:01
@dr jerry, I am not using FF; With IE9, getElementById works only for the nodes that are loaded from .svg files; is not working the modified nodes or nodes that added during runtime; in fact, I added new element; found it using getElementsByTagName() but it is returned as a '[object Element]' where as I expected it to be a '[object SVGRECT]' :( — Venkatesh Laguduva, Feb 13 '12 at 17:22

score 0 · Accepted Answer · edited May 23 '17 at 12:27

0

It seems that getElementById() did not find the newly added elements because they were not recognized as svg element; they were missing the svg namespace in it. Once I added the namespace, it worked. Pleas see this answer for more details.

edited May 23 '17 at 12:27

Community

1
1

answered Feb 15 '12 at 10:00

Venkatesh Laguduva

13,448
6
33
45

getElementById() is not working after modifying the SVG Document

1 Answers1

Linked