www.webdeveloper.com
Results 1 to 5 of 5

Thread: getAttribute('id') in IE

  1. #1
    Join Date
    Jan 2008
    Posts
    4

    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');
    }
    }
    }

  2. #2
    Join Date
    Jan 2008
    Posts
    25
    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

  3. #3
    Join Date
    Jan 2008
    Posts
    4
    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

    }

  4. #4
    Join Date
    Jan 2008
    Posts
    25
    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

  5. #5
    Join Date
    Jan 2008
    Posts
    4
    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.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles