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 3 of 3
  1. #1
    Regular Coder
    Join Date
    Nov 2005
    Posts
    230
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Accessing a cell in a nested table

    I want to access a particular cell in a table...telling javascript to click that cell which has a corresponding action...

    Code:
    <script>
    document.write('<table id=t1>')
    
    for (i=0;i<5;i++){
    document.write('<tr><td onclick=action()></td><td>...</td></tr>')
    }
    
    document.write('</table>')
    
    t1.rows[0].cells[0].click() //click cell 1 of row 1
    </script>
    and i would use this code for that....

    these are only samples..each rows are actually created in a loop...but what if....

    Code:
    <script>
    document.write('<table id=t1>')
    
    for (i=0;i<5;i++){
    document.write('<tr><td onclick=action()><table><tr><td onclick=action()></td></td></tr></table></td><td>...</td></tr>')
    }
    
    document.write('</table>')
    </script>
    that table i need is nested under the table t1....i cant use ids here since i'm doing a loop there..so is there a solution to achieve the clicking on a cell done on the former code?

    i want this time to click cell 1 of row 1 IN table t1 row 1 cell 1

    Thanks!

  • #2
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    There is probably more than one way to do it. One is to use getElementsByTagName('table') on the cell you are interested in. Here is an example of that working.

    Code:
    <script>
    
    function action(e, s) {
      if (e.stopPropagation) {
        e.stopPropagation();
      } else {
        e.cancelBubble = true;
      }
      alert("cell clicked: " + s);
    }
    document.write('<table id=t1>')
    
    for (i=0;i<5;i++){
    document.write('<tr><td onclick="action(event, '+i+')"></td><td>...</td></tr>')
    }
    
    document.write('</table>')
    
    document.write('<button onclick="t1.rows[0].cells[0].onclick()">Do it</button>'); //click cell 1 of row 1
    </script>
    <br><br><br><br>
    <script>
    document.write('<table id=t2>')
    
    for (i=0;i<5;i++){
    document.write('<tr><td onclick="action(event, '+i+')"><table><tr><td onclick="action(event, \'nested\'+'+i+')"></td></td></tr></table></td><td>...</td></tr>')
    }
    
    document.write('</table>')
    
    document.write('<button onclick="t2.rows[0].cells[0].getElementsByTagName(\'table\')[0].rows[0].cells[0].onclick()">Do it</button>'); //click cell 1 of row 1 in nested table
    </script>
    I suspect there is a "better" way but it's too early to try and think of it right now. :)

    david_kw

  • #3
    Regular Coder
    Join Date
    Nov 2005
    Posts
    230
    Thanks
    1
    Thanked 0 Times in 0 Posts
    hey, thanks... didn't thought of that haha...


  •  

    Posting Permissions

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