...

View Full Version : determining row & col nr in table?



Kirl
07-28-2006, 12:24 AM
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...

Kravvitz
07-28-2006, 03:18 AM
Check out this script I posted elsewhere. (http://forums.devshed.com/javascript-development-115/change-bgcolor-of-a-particular-table-cell-318239.html#post1367596)

Kirl
07-28-2006, 09:39 AM
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.


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
}

vwphillips
07-28-2006, 11:26 AM
<!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>

Kirl
07-28-2006, 11:50 AM
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".

Kor
07-28-2006, 12:06 PM
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?

vwphillips
07-28-2006, 12:06 PM
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.

Kirl
07-28-2006, 01:21 PM
@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 (http://www.kirl.nl/javaSnake.html)) 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.

Kor
07-28-2006, 01:27 PM
@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
07-28-2006, 01:31 PM
There might be another problem, I don't know if related... How the id's of your cells look like?

vwphillips
07-28-2006, 01:54 PM
Mistake 1

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

Kirl
07-28-2006, 01:57 PM
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) ?

Kor
07-28-2006, 02:08 PM
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
07-28-2006, 02:10 PM
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.

vwphillips
07-28-2006, 02:21 PM
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'

Kor
07-28-2006, 02:25 PM
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'

I know... I know... But leave him to fulfil his childhood ;) . He wants to understand what was wrong it his code, and this is a good point. Let's hope he will starting soon studying deeper the DOM methods... I fully agree, insertBefore() is the best way. And, as I said, your code is very nice.

vwphillips
07-28-2006, 02:38 PM
thanks kor but I thought kiri wanted to learn and I get frustrated.

Kor
07-28-2006, 02:44 PM
thanks kor but I thought kiri wanted to learn and I get frustrated.
You remaind me about my mother. She always presumed that I wanted to learn even in the moments I was to go out and play with the other kids. :)

On the other hand, you see, human nature is strange. The good and intelligent people are sometimes stubborn enough to follow their own ideeas, at least for the reason that they want to finish something they have started...

Kirl
07-28-2006, 04:14 PM
I do not understand the condescending tone, I've seen it before on these boards, it's insulting and presumptious. I am 23 years old and my original craft is computer animation (http://www.kirl.nl/simple3dGallery.html). I simply want to explore other areas of interest, instead of sticking to what I know.

Neither do I understand why you think I haven't looked at your code, I explained it is over my head. There are subtle syntax diffrences wich prevent me from fully following the code. My main goal here is indeed learning, it would be great if you'd walk me through it, but I don't think that would be very efficient.

And by the way, my name is KirL, not Kiri...

Thanks for the help, but get off your high horses. You may posses scripting knowledge but that doesn't make you are any wiser then even the n00biest of n00bs...

Kor
07-28-2006, 04:32 PM
May we be excused if you felt insulted. We were far from trying to do that. I doubt that you will find anything injurious in my posts. More that that, I was even defended your will, as I understand that is very important to learn, not to use somone else's work.

Once again, excuse me/us. We have not even the slightest intention to offend you.

make peace

:thumbsup:

I do not understand the condescending tone, I've seen it before on these boards, it's insulting and presumptious. I am 23 years old and my original craft is computer animation (http://www.kirl.nl/simple3dGallery.html). I simply want to explore other areas of interest, instead of sticking to what I know.

Neither do I understand why you think I haven't looked at your code, I explained it is over my head. There are subtle syntax diffrences wich prevent me from fully following the code. My main goal here is indeed learning, it would be great if you'd walk me through it, but I don't think that would be very efficient.

And by the way, my name is KirL, not Kiri...

Thanks for the help, but get off your high horses. You may posses scripting knowledge but that doesn't make you are any wiser then even the n00biest of n00bs...

Kirl
07-28-2006, 04:55 PM
Thanks Kor, I really do apriciate the help.

I am still very open to any kind of explanation of why insertBefore would be better... :)

Although I'll probably get to it myself eventually...



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum