[RESOLVED] DOM differences between IE and everything else

[BillGeek]

I was experimenting with AJAX a bit yesterday and actually got it working in FireFox. When I wanted to see whether it still works in IE, I was not surprised when it didn't.

There seems to be a major difference in DOM Scripting between IE and the other browsers. For example, see the following code:

var cTotalReturn = xmlHttp.responseText;
var cPostId = cTotalReturn.substring(0, cTotalReturn.indexOf("|"));
var cPostText = cTotalReturn.substring(cTotalReturn.indexOf("|") + 1);

// Get all elements by specific names
var myQuickPosts = document.getElementsByName("ajaxQuickPost");
var myEditButtons = document.getElementsByName("ajaxEditButton");
var myQuoteButtons = document.getElementsByName("ajaxQuoteButton");
var myPostIds = document.getElementsByName("ajaxShowPostId");
var myPostTexts = document.getElementsByName("ajaxPostText");
var myPostTitles = document.getElementsByName("ajaxPostTitle");

// try to copy the node
var newAjax = myQuickPosts[myQuickPosts.length-1].cloneNode(true);
// add the copied node to the body itself
document.body.appendChild(newAjax);

// set specific values depending on the return from the xmlHttpRequest object
// I'm using -2 because:
// A) The array starts at 0
// B) I want to fill the second last one, as the copied one will have a display style of none
myQuickPosts[myQuickPosts.length-2].style.display = "";
myEditButtons[myEditButtons.length-2].href += cPostId;
myQuoteButtons[myQuoteButtons.length-2].href += cPostId;
myPostIds[myPostIds.length-2].href += cPostId;
myPostTexts[myPostTexts.length-2].innerHTML = cPostText;
myPostTitles[myPostTitles.length-2].innerHTML = "<b>" + document.getElementById("txtTitle").value + "</b>";

Now in FireFox, Opera, etc... myQuickPosts.length will return the number of items with the same name. (If I have 10, it will return 10), but in IE it ALWAYS returns 0.

Am I doing something wrong, or is this a known issue with a known workaround?

[Pino]

Well IE does not handle quite well the getElementsByName() method, thus you better use getElementsByTagName() and the elements's indexes instead

http://www.webdeveloper.com/forum/ar...p/t-53696.html

I really recomend you have a look at JQuery or a similar Javascript language, it will save so much hassle with issues like this

Hope this helps

[BillGeek]

Thanks. I'll give it a try and update this thread.

I'm also going to look into JQuery. It seems very interesting.

[Pino]

Yea JQuery will blow your mind, makes the simple Javascript stuff work like dream, Just shout if you need any help.

[BillGeek]

Will do. Are you using JQuery at the moment? I'm still trying the first suggestion (getElementsByTagName) but will try using JQuery once I understand just how it works.

[Pino]

Yea I have been using JQuery for about 6 Months. I would'nt ever use Javascript again as Jquery just makes life so simple!

Pino

[BillGeek]

Cool. Unfortunately this is going to take me a while to learn, so I'm just going to resolve this thread.

Thanks for the help!