Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Sep 2002
    Posts
    143
    Thanks
    0
    Thanked 0 Times in 0 Posts

    can't attach dynamic id to table row

    Hello
    im trying to attach dynamic id attribute but for some reason im getting only the last
    id name , if you will run this script you will get on the onclick event alert only the "r3" name
    no Metter what row you will click. what i was expecting is to get different id name for every
    row ("r0","r1","r2","r3").
    ----------------------------------------------------------------------------------------------------------------------------------------------------------
    <HTML>
    <HEAD>
    <script>
    function userSelect(o){alert(o.id)}
    function setTable(){
    var oRow,oCellText;
    var arrNames = "blah1|blah2|blah3|blah4|";
    arrNames = arrNames.split("|");
    for(var i=0;i<arrNames.length-1;i++){
    oRow = TableFirst.insertRow();
    oRow.id = "r"+i;
    oRow.attachEvent("onclick",function(){userSelect(oRow)});
    oCellText = oRow.insertCell();
    oCellText.innerHTML = arrNames[i];
    }
    }
    </script>
    </HEAD>
    <BODY>
    <input type="button" onclick="setTable();" value="build"><br>

    <table id="TableFirst" border="1" cellspacing="0" cellpadding="0" width="100%" class="font"></table>
    </BODY>
    </HTML>
    -----------------------------------------------------------------------------------
    thanks

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    	function userSelect(){alert(event.srcElement.innerHTML)}
    	function setTable()
    		{
    		var oRow,oCellText;
    		var arrNames = "blah1|blah2|blah3|blah4|";
    		arrNames = arrNames.split("|");
    		for(var i=0;i<arrNames.length-1;i++)
    			{
    			oRow = document.getElementById("TableFirst").insertRow(-1);
    			oRow.id = "r"+i;
    			document.getElementById("r"+i).attachEvent("onclick", userSelect);
    			oCellText = oRow.insertCell();
    			oCellText.innerHTML = arrNames[i] + oRow.id;
    			}
    		}
    Remember you're attaching an "event" handling function which comes with it's own event object.
    Check out the Forum Search. It's the short path to getting great results from this forum.

  • #3
    Regular Coder
    Join Date
    Aug 2003
    Posts
    383
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Your problem is...you aren't really 'attach[ing a] dynamic id attribute' at all; you're assigning a function literal, which generates a function object with exactly the code you type in. No values are 'filled in' when the function is assigned, so any parameters will have to be resolved when the handler runs, which will be in a completely different context. If you want to 'fill in' a value at the time the handler is assigned, you'll need to use the Function constructor (function!), which evaluates the function body as a string:
    Code:
    <HTML>
    <HEAD>
    <script>
    function setTable(){
    var oRow,oCellText;
    var arrNames = "blah1|blah2|blah3|blah4|";
    arrNames = arrNames.split("|");
    for(var i=0;i<arrNames.length-1;i++){
    oRow = TableFirst.insertRow();
    oRow.id = "r"+i;
    oRow.attachEvent("onclick", new Function('alert("' + oRow.id + '")') );
    oCellText = oRow.insertCell();
    oCellText.innerHTML = arrNames&#91;i];
    }
    }
    </script>
    </HEAD>
    <BODY>
    <input type="button" onclick="setTable();" value="build"><br>
    
    <table id="TableFirst" border="1" cellspacing="0" cellpadding="0" width="100%" class="font"></table>
    </BODY>
    </HTML>
    Now I'm baffled... when you do this:

    function(){userSelect(oRow)})

    ....the handler, when it runs, is long gone from the setTable function which registered it, and should have no idea of what 'oRow' is...and yet it does! It alerts the last value of oRow, which is a....local variable (to setTable). How is that possible? Interesting, though (maybe Internet Explorer exposes local variables as globals, wouldn't surprise me). Anyone....?
    &nbsp;........ another wild guess ........

  • #4
    Regular Coder
    Join Date
    Sep 2002
    Posts
    143
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hello
    first of all tnx for the tip , but still .. it dont keep the function handler attached to its object , it seams like the function handler
    working in the minute it was created , but then when i try to
    "onclick" the object i dont get any attached event fired.
    what is wrong here?

  • #5
    Regular Coder
    Join Date
    Sep 2002
    Posts
    143
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok ignor my last post every thing is working fine


  •  

    Posting Permissions

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