Question

I have a project where I have to make a game in ASP.net called futoshiki (see http://www.dofutoshiki.com for an example of what I am making).
I am using visual studio 2010.

I have a 5 x 5 table, where each cell contains an integer 1 – 5. the user should be able to click on the cell, and then press a number 1 – 5.
My problem is, I cant seem to make the table cells click-able. I want a user to be able to click the cell that they want to change, and enter a number from 1 to 5.

I’ve seen example where people have used [a] and [span]. But I don’t really think its necessary for each table cell to be a link. I just want each table cell to generate an event when its clicked, and then the event handler (C# event handler) reads in the input value, checks if it’s valid etc, then changes the value of the table cell to the new input value.

I also tried looking at [div] also. Instead of having a 5 x 5 table, I could just have like…. 25 div tags. but I failed at making them click-able!

Thanks!

Alex

Answer 1

If you use jQuery (which you should), you can bind to the click event like so…

<table>
   <tr>
        <td id="cell_1_1"><!-- something here --></td>
        <td id="cell_1_2"><!-- something here --></td>
        <td id="cell_1_3"><!-- something here --></td>
        <td id="cell_1_4"><!-- something here --></td>
        <td id="cell_1_5"><!-- something here --></td>
   </tr>
</table>

<script type="text/javascript">
     $('#cell_1_1').click(function(){ alert("This is how we do it!"); });
</script>

Good luck!