/    Sign up×
Community /Pin to ProfileBookmark

getAttribute(‘id’) in IE

Hi. Im pretty new to js so bare with me. I have a piece of a script that grabs all of the checkboxes within a specific div element and puts them into the allInputs variable and then loops through the allInputs variable to find the checkbox with a specific id and puts that checkbox in the mainGroupInput variable and toggles the checkbox appropriately. The code works perfectly in normal browsers like FF and Safari, but no luck in IE.

The problem seems to be at the .getAttribute(‘id’). IE simply wont grab the id of the element that it is on. Ive tried .getAttributeNode(‘id’).value, attributes[‘id’]. Nothing seems to work. I’ve been reading up on .getAttribute() method for IE and it looks sorta weird, but i cant find anything that has a solution for my problem.

mainContainer=document.getElementById(mC);
allInputs=mainContainer.getElementsByTagName(‘input’);
for(e=0; e<allInputs.length; e++) {
// this is where it fails in IE. it wont grab the id of the current input
if(allInputs[e].getAttribute(‘id’) == (g_id+’_’+(sib_id-1))) {
mainGroupInput=allInputs[e];
alert(allInputs[e].getAttribute(‘id’)); // works in FF
alert(allInputs[e].attributes[‘id’].value); // works in FF
if(mainGroupInput.checked==true) {
alert(‘checked’);
} else {
alert(‘unchecked’);
}
}
}

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@skyrider01Jan 20.2008 — to me it seems to be working, if you have the full source somewhere I can have a look, in my quick test I did get an IE security warning, so could be related to some security issue in IE
Copy linkTweet thisAlerts:
@hrysaxauthorJan 22.2008 — Thanks for your reply skyrider01. the full source of the js is below. the friendsToggle() accepts 'g_id' var which is the main group to toggle, the 'sib_id' var which is the actual div of the checkboxes to toggle, the 'action' var which is the action to be performed, the 'cbid' var which is the id of the input thats been checked, and the 'mC' var which is the id of the main container that holds all of the groups. The html structure and the JS function is below. You can see that the checkboxes with ids of 'g*_1' toggle the checkboxes within the div of the 'g*_2':

<div id='mainContainer'>

<input type="checkbox" id="g1_1" onClick="friendsToggle('g1', 2, 1, null, 'mainContainer'>

<div id="g1_2">

<input type="checkbox" id="00" class="001" onClick="friendsToggle('g1', 1, 2, 00, 'mainContainer')">

<input type="checkbox" id="01" class="002" onClick="friendsToggle('g1', 1, 2, 01, 'mainContainer')">

<input type="checkbox" id="02" class="003" onClick="friendsToggle('g1', 1, 2, 02, 'mainContainer')">

</div>

<input type="checkbox" id="g2_1" onClick="friendsToggle('g2', 2, 1, null, 'mainContainer'>

<div id="g1_2">

<input type="checkbox" id="03" class="001" onClick="friendsToggle('g2', 1, 2, 03, 'mainContainer')">

<input type="checkbox" id="04" class="002" onClick="friendsToggle('g2', 1, 2, 04, 'mainContainer')">

<input type="checkbox" id="05" class="003" onClick="friendsToggle('g2', 1, 2, 05, 'mainContainer')">

</div>

</div>

</div>

function friendsToggle(g_id, sib_id, action, cbid, mC) {

// determine if the user wants to toggle all of the groups friends, or is

// toggling just one friend

switch(action) {

case 1:

// the user wants to toggle all of the groups friends

mainContainer=document.getElementById(mC);

allInputs=mainContainer.getElementsByTagName('input');

for(e=0; e<allInputs.length; e++) {

if(allInputs[e].getAttribute('id') == (g_id+'_'+(sib_id-1))) {

mainGroupInput=allInputs[e];

if(mainGroupInput.checked==true) { alert('checked'); } else { alert('unchecked'); }

}

}

break;

case 2:

// the user wants to toggle individual friends

// toggle the main group checkbox

break;

case 3:

// the user wants to toggle all of their friends

break;

default:

break;

}

// scan through all of the groups, including the default 'all friends' and toggle

// the groups' main group checkbox


// scan through all of the checkboxes and toggle the 'select/deselect all'

// checkbox

}
Copy linkTweet thisAlerts:
@skyrider01Jan 22.2008 — Ok found the error, well not your fault, stupid IE, the variable name in your javascript "mainContainer" cant be called that, since that is the name of the id too, so if you change the name of the variable in the javascript from mainContainer to eg. mainContainer1, it will work.

Funny stuff ?
Copy linkTweet thisAlerts:
@hrysaxauthorJan 23.2008 — Ah thank you so much i love you! it works flawlessly now. IE sucks so much. it gives me the biggest headache with everything...especially css.
×

Success!

Help @hrysax spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...