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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 21
  1. #1
    Regular Coder
    Join Date
    Jan 2006
    Posts
    243
    Thanks
    14
    Thanked 2 Times in 2 Posts

    determining row & col nr in table?

    Is there any way to determine the row & collumn number of a certain cell within a table?

    I've looked at rowIndex and similar stuff, but I can not get it working. The info I found on this was minimal...

  • #2
    Senior Coder
    Join Date
    Feb 2006
    Location
    USA
    Posts
    1,013
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Learn CSS. | SSI | PHP includes | X/HTML Validator | CSS validator | Dynamic Site Solutions
    Java != JavaScript && JScript != JavaScript
    Design/program for Firefox (and/or Opera), apply fixes for IE, not the other way around.

  • #3
    Regular Coder
    Join Date
    Jan 2006
    Posts
    243
    Thanks
    14
    Thanked 2 Times in 2 Posts
    Great, thanks a lot.

    Looks like a flexible setup, some of the code is just above my head though. I'm not exactly sure where the rows and collums are read.

    I'm using the function below to move one cell to the right in a table that is dynamically generated with cell coordinates already assigned as ID. However this only works in a table that is less then 10x10 because I use charAt to determine the row and column, once the input is more then 2 digits, it fails.

    But I'm not exactly sure where the rows and collumns are determined in your script, could you show me the loop to look for?

    I want to replace my charAt method with that loop.

    Code:
    function moveRight(Nr)
    {
    		coordinates = "" + Nr;	// convert to String
    		row = coordinates.charAt(0);
    		col = coordinates.charAt(1);
    		
    		Nr += 1;
    		if ( col == ( tableSize - 1 ))
    		{
    			Nr -= ( tableSize - 1 );
    		}		
    		
    	globalCell = Nr;		// update globalCell so it continues with correct cell
    	
    	colorCells( Nr );		// color cell	
    }
    Last edited by Kirl; 07-28-2006 at 10:41 AM.

  • #4
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,535
    Thanks
    3
    Thanked 513 Times in 500 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    // by Vic Phillips (28-July-2006) http://www.vicsjavascripts.org.uk
    
    function zxcMve(zxcdir){
     var zxcevt=window.event||arguments.callee.caller.arguments[0];
     var zxcobj=zxcEventObj(zxcevt);
     var zxctd,zxctr,zxctable;
     while (zxcobj.parentNode){
      if (zxcobj.tagName=='TD'){ zxctd=zxcobj; } // this finds the TD
      if (zxcobj.tagName=='TR'){ zxctr=zxcobj; } // this finds the TR
      if (zxcobj.tagName=='TABLE'){ zxctable=zxcobj; break; } // this finds the TABLE
      zxcobj=zxcobj.parentNode;
     }
     var zxcrows=zxctable.getElementsByTagName('TR');
     var zxcrtd;
     if (zxcdir=='R'||zxcdir=='L'){
      for (var zxc0=0;zxc0<zxcrows.length;zxc0++){
       var zxccols=zxcrows[zxc0].getElementsByTagName('TD');
       for (var zxc0a=0;zxc0a<zxccols.length;zxc0a++){
        if (zxccols[zxc0a]==zxctd){
         zxcrtd=(zxcdir=='R')?zxccols[zxc0a+1]:zxccols[zxc0a-1];
         break;
        }
       }
      }
     }
     if (zxcdir=='U'||zxcdir=='D'){
      var zxcrcol;
      for (var zxc0=0;zxc0<zxcrows.length;zxc0++){
       var zxccols=zxcrows[zxc0].getElementsByTagName('TD');
       for (var zxc0a=0;zxc0a<zxccols.length;zxc0a++){
        if (zxccols[zxc0a]==zxctd){
         if (zxc0>0&&zxcdir=='U'){ zxcrcol=zxcrows[zxc0-1].getElementsByTagName('TD'); }
         if (zxc0<zxcrows.length-1&&zxcdir=='D'){ zxcrcol=zxcrows[zxc0+1].getElementsByTagName('TD'); }
         if (zxcrcol){ zxcrtd=zxcrcol[zxc0a]; }
         break;
        }
       }
      }
     }
     if (zxcrtd){
      zxcrtd.parentNode.insertBefore(zxctd.cloneNode(true),zxcrtd);
      zxctd.parentNode.insertBefore(zxcrtd.cloneNode(true),zxctd);
      zxctd.parentNode.removeChild(zxctd);
      zxcrtd.parentNode.removeChild(zxcrtd);
     }
    }
    
    function zxcEventObj(zxce){
     if (!zxce) var zxce=window.event;
     zxce.cancelBubble=true;
     if (zxce.stopPropagation) zxce.stopPropagation();
     if (zxce.target) zxceobj=zxce.target;
     else if (zxce.srcElement) zxceobj=zxce.srcElement;
     if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
     return zxceobj;
    }
    
    
    /*]]>*/
    </script></head>
    
    <body>
    <table cellpadding="0" cellspacing="0" border="1">
      <tr>
        <td width=100>
        <img src="http://www.vicsjavascripts.org.uk/StdImages/left.gif" onclick="zxcMve('L');"/>
        <img src="http://www.vicsjavascripts.org.uk/StdImages/up[1].gif" onclick="zxcMve('U');" />
        <img src="http://www.vicsjavascripts.org.uk/StdImages/down[1].gif" onclick="zxcMve('D');" />
        <img src="http://www.vicsjavascripts.org.uk/StdImages/right.gif" onclick="zxcMve('R');" />
        </td>
        <td width=100>R0 C1</td>
      </tr>
      <tr>
        <td width=100>R1 C0</td>
        <td width=100>R1 C1</td>
      </tr>
      <tr>
        <td width=100>R2 C0</td>
        <td width=100>R2 C1</td>
      </tr>
    </table>
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #5
    Regular Coder
    Join Date
    Jan 2006
    Posts
    243
    Thanks
    14
    Thanked 2 Times in 2 Posts
    I apriciate the help, but I already have a working program wich I'm quite happy with. I just need a way to determine the row and collumn coordinates of a table with a variable amount of rows or columns (row and collumn ratio is always 1:1 though).

    I think I can make it work by separating the coordinate id's with a comma between row and collumn.

    But for that I just need to know how to assign everything before the comma to a variable called "row", and everything behind the comma to variable "col".
    Last edited by Kirl; 07-28-2006 at 12:53 PM.

  • #6
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Nice code, vwphillips, I was ready, an hour ago, to ask Kirl if he could consider a simplier code using insertBefore() method, but I realized that he could tell us that is too late to change the code and he prefere to continue his.

    Kirl,
    cellobject.cellIndex attribute will return the cell's position in the row, thus the "column index" (the X index) of the cell
    cellobject.parentNode.rowIndex attribute will return the cell's parent (thus the row) position in the tbody, thus the "row index" (the Y index) of the cell

    Are these the values you are looking for?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #7
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,535
    Thanks
    3
    Thanked 513 Times in 500 Posts
    If you examine the code I posted then you would have your answer.


    I already have a working program wich I'm quite happy
    the trouble is that it is inflexable and does not meet your requirement.
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #8
    Regular Coder
    Join Date
    Jan 2006
    Posts
    243
    Thanks
    14
    Thanked 2 Times in 2 Posts
    @vwphillips
    I tried searching through your code, but I can't keep up with everything, I've only recently started using Javascript.

    What wouldn't work with my code though? (You can have a look at the complete code here) I tested everything and it all works as it should except for tables with more then 10x10 cells. But I suspect Kor's tip may fix that.


    @ Kor
    Thanks, I think that might work, I'll have to do some testing.

    I'd be quite interested in hearing your insertBefore() method as well, but as I'm writing all these programs to learn javascript, I first hack the stuff together and then start cleaning stuff up, or if nessesary re-write. I find this to be a very effective learning method.
    Last edited by Kirl; 07-28-2006 at 02:33 PM.

  • #9
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Quote Originally Posted by Kirl
    @vwphillips
    @ Kor

    I'd be quite interested in hearing your insertBefore() method as well, but as I'm writing all these programs to learn javascript, I first hack the stuff together and then start cleaning stuff up, or if nessesary re-write. I find this to be a very effective learning method.
    Yes. That is exactly what I thought. I have always thought that the way through is more important than the scope. As I said, I prefered not to change your code dramatically. I have also learned javascript by my own tests and mistakes, trying first to understand and create my own codes rather than to apply someonelse's code which I might have not understood.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #10
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    There might be another problem, I don't know if related... How the id's of your cells look like?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #11
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,535
    Thanks
    3
    Thanked 513 Times in 500 Posts
    Mistake 1

    using IDs
    cells are already identified by their position in the table
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #12
    Regular Coder
    Join Date
    Jan 2006
    Posts
    243
    Thanks
    14
    Thanked 2 Times in 2 Posts
    1st row = c11, c12, c13, c14, c15 etc.
    2nd row = c21, c22, c23, c24, c25 etc
    3rd row = c31, c32 etc....

    I've written a getObject function that retrieves the cell object. This basicallly just paste a "c" before it's input and ouputs the actual object. I found it's a syntax error to start a name with a number.


    edit
    @vwphillips
    Yes, I didn't know that, is that what Kor suggested a few posts back (cellIndex, rowIndex) ?
    Last edited by Kirl; 07-28-2006 at 03:05 PM.

  • #13
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    aha... that makes things clear...

    row = coordinates.charAt(0);
    col = coordinates.charAt(1);

    this should work only when the rows/cols are no longer than 10 (that means the last index in their collections is 9). As long as it will overpass, the id will have 3 digits. For instance for:

    c101

    row = coordinates.charAt(0);//will return 1
    col = coordinates.charAt(1);//will return 0

    You should consider using underscores and a split() method to retreive the correct values

    var id ="c_10_1"
    var row=Number(id.split('_')[1]);// will return 10, the row
    var col=Number(id.split('_')[2]);// will return 1, the column

    now
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #14
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Quote Originally Posted by vwphillips
    Mistake 1

    using IDs
    cells are already identified by their position in the table
    Vic... maybe Kirl wants to keep the track of which cell was by default where. same as in your code where you write in the cell the genuine row/column.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #15
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,535
    Thanks
    3
    Thanked 513 Times in 500 Posts
    kor but you dont need to acually use the id.

    the id is still attached to the cell where ever it is, as with my text

    using the id makes a simple job difficult.

    dont think that kiri has even looked at the code I posted,
    else he would not be asking about 'insertBefore'
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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