jQuery Image Click Help

Question

I'm like 2 hours new to jQuery.

I have a list that has usernames and an image next to each username. If they click on the the image next to the username that username will get deleted.

Example:

<table>
<tr><td>MARK</td><td><img src=delete.jpg id=MARK></td></tr>
<tr><td>DAVE</td><td><img src=delete.jpg id=DAVE></td></tr>
</table>

Those usernames are spit out of a MySQL database. How do I get jQuery to figure out which image is clicked? Since I can't hardcode the image id into the script....

Thank you

Answer 1

Just use onclick function -

<table>
<tr><td>MARK</td><td><img src=delete.jpg id="mark" onclick="test(this)"></td></tr>
<tr><td>DAVE</td><td><img src=delete.jpg id="dave" onclick="test(this)"></td></tr>
</table>


<script type="text/javascript">
function test(obj){
$(obj).hide();
//In the same way you can perform any operation.
}
</script>

If you want to use id anyways then - 

<script type="text/javascript">
function test(obj){
var id = $(obj).attr('id');
//Now you can perform any operation using it's id.
}
</script>

Answer 2

You choosed wrong approach. If you want to delete that records server side, you have to make it via some serverside logic (PHP, Java, Ruby... etc) without any using of clientside (jQuery) first. The second step can be javascript (jQuery calling of this serverside logic) via AJAX if you want. So write some serverside script to delete concrete records in your database, then turn your delete.jpg images into links or forms to call that script with record id in parameter.