createElement name not setting in...?

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
paqman
Forum Contributor
Posts: 125
Joined: Sun Nov 14, 2004 7:41 pm
Location: Burnaby, BC, Canada

createElement name not setting in...?

Post by paqman »

Hey I'm trying to get a bit of Ajax working, and I'm stuck on the very last part. Here's the chunk of code:

Code: Select all

 
var receivedText = theSync.responseText; //data as a string
            if(receivedText .indexOf('%tr' != -1))
            {
                //remove old entries
                //alert(document.getElementsByName("basketRow").length); - outputs 0, suggesting my theTR.name is not working...
                for(l = 0; l < document.getElementsByName("basketRow").length; l++)
                {
                    document.getElementsByName("basketRow")[l].parentNode.removeChild(document.getElementsByName("basketRow")[l]);
                }
                
                //go through each tr
                element = receivedText.split('%tr');
                for(i = 0; i < element.length; i++)
                {
                    var theTR = document.createElement("tr");
                    theTR.name = "basketRow"; //I believe this is the offender...
                    
                    if(element[i] .indexOf('%td' != -1))
                    {
                        pieces = element[i].split('%td');
                        
                        //go through each td
                        for(j = 0; j < pieces.length; j++)
                        {
                            var theTD = document.createElement("td");
                            theTD.innerHTML = pieces[j];
                            theTD.vAlign = "top";
                            theTR.appendChild(theTD);
                        }
                        
                        //output row
                        document.getElementById("basketShort").parentNode.insertBefore(theTR, document.getElementById("basketShort"));
                    }
                    
                }
 
            }
 
I'm sure there are better ways to do this, but this is how I've got it to work. If I put a tr element in the page, outside of the code, with the name 'basketRow', it is recognized by that piece of code and is removed when this script runs. However, the dynamically created and added rows are not. I'm guessing this is because I'm not applying the name properly, but I'm not sure. Any help would be greatly appreciated.
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: createElement name not setting in...?

Post by kaszu »

There are 2 problems with your code
1) If for example there are 2 rows, then removing first row, second row will become first in document.getElementsByName("basketRow") array and there is no row with index [1] in it anymore, which will trigger an error. Fix is to iterate array from last element to first:

Code: Select all

var rows = document.getElementsByName("basketRow");
for (l = rows.length-1; l>=0; l--) {
    rows[l].parentNode.removeChild(rows[l]);
}
2) As you mentioned "theTR.name" is the problem, use setAttribute instead

Code: Select all

theTR.setAttribute("name", "basketRow");
User avatar
paqman
Forum Contributor
Posts: 125
Joined: Sun Nov 14, 2004 7:41 pm
Location: Burnaby, BC, Canada

Re: createElement name not setting in...?

Post by paqman »

Just realized today that it's not working in IE... Firefox is fine, but it isn't deleting the elements based on their name in IE. Anyone have an idea what needs to be different for IE?
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: createElement name not setting in...?

Post by kaszu »

IE has that issue, set also id="basketRow". It won't validate, but it will work at least.

Code: Select all

theTR.setAttribute("id", "basketRow");
Post Reply