Welcome to WebmasterWorld Guest from 54.226.194.180

Forum Moderators: open

Message Too Old, No Replies

Know from which cell was clicked

images in a 8x8 table with onclick event

     

purefan

3:58 pm on Dec 24, 2005 (gmt 0)

5+ Year Member



hello.
I have a table with 64 squares representing a chess board.
on some squares I have images (for the pieces) and I am trying to allow the user to do a click-click and move the piece to its new location.
The <TD> have been IDed (from a to h for the columns and 1 to 8 for the rows).
I approached it by setting the onclick event on the images but it doesnt give me the id of its container <TD>.
here is my last try:

<td id="a8" bgcolor="#FFFFFF"><img src="bitmaps/trans/br2.gif" onClick="getmove(window.event.srcElement.id);"></td>

the function getmove only shows an alert with parameter for testing purposes. I read somewhere about this srcElement.id but my firefox says that srcElement has no properties.

in short: how do I get the ID of the <td> containing the onclicked image?

gph

4:40 pm on Dec 24, 2005 (gmt 0)

10+ Year Member



I don't think the approach is correct. If you want to move the image you need a reference to it and the td.

onclick="getmove(this)"

then in the function

function getmove(img){
var td=img.parentNode;
...
}

purefan

7:51 pm on Dec 24, 2005 (gmt 0)

5+ Year Member



thank you for posting.
I found another way:

<td id="a8" onClick="getmove(this.id);" bgcolor="#FFFFFF"><img src="bitmaps/trans/br2.gif"></td>

to add the onclick to the TD itself.

this is working for me but I will give it a try to your code a bit later.
Thanks again!

Bernard Marx

1:30 am on Dec 25, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Since you are likely to only be using the
id
to get a reference to the clicked element using
getElementById
, you might as well just pass the ref itself (
this
), as suggested, and save the effort.
 

Featured Threads

Hot Threads This Week

Hot Threads This Month