Passing in parameters to jQuery .click

Question

I have a list, populated from rows in a MySQL database and I want to flag those rows in the database when the link is clicked, using jQuery .click and .ajax by triggers a PHP script and passing in the the database primary key ID.

I have this jQuery code so far:

$(document).ready(function() {
    $("#clickme").click(function() {
        $.post("removeDNFromBulk.php");
    );
});

But I need to pass in an ID to removeDNFromBulk.php, either as POST or GET, either suits.

I have this HTML to trigger the jQuery code

<a id="clickme" href="javascript:void(0);">click me</a>

Obviously I'm not passing in any ID to the jQuery but that's that part I can't get my head around. How can that be done?

A small comment. GET should really not be used for operations that are going to change the model, you should really restrict that to a POST operation. That way anything that crawled a page wouldn't suddenly delete things. — John Munsch, Jul 26 '11 at 21:28
@John Munsch: get / post... either way there should be some form of check before deleting from database. Not only crwaling of pages to be worried about :) — PeeHaa, Jul 26 '11 at 21:32
Pages wont be crawled as I will be using robots.txt and the flag on the database row wont be set unless there is verification against session data, which can only be obtained with a valid user/pass. But never-the-less, you raise a good point — Ste, Jul 26 '11 at 21:36
@Ste: robots.txt is no guarantee at all that it won't be visited by some bad bad crawlers / spiders :) However since you use verification (as you should) that isn't an issue :D — PeeHaa, Jul 26 '11 at 21:38

PeeHaa · Answer 1 · 2011-07-26T21:34:14.907

2

I would do something like this:

I would use a class because if I understand your question correct there are several clickme links. Id's should always be unique.

Also I have removed that ugly javascript:void(0) thingy :)

And I've added the id to the data attribute of the link.

<a class="clickme" href="#" data-id="{the id}">click me</a>

You can add data to the post like the following.

$(document).ready(function() {
    $('.clickme').click(function() {
      var del_id = $(this).data('id');
      $.post("removeDNFromBulk.php", { id: del_id } );

      return false;
    });
});

The return false prevents both the event bubbling up the DOM and the default behaviour of the click.

EDIT

You should wrap the code in a document ready to make sure the element is loaded before trying to access it.

edited Jul 26 '11 at 21:34

answered Jul 26 '11 at 21:18

PeeHaa

71,436
58
190
262

That doesn't work. I've added an alert() call in the jQuery and that isn't triggered when I press the link nor is the PHP script being initiated. Firefox error console is reporting no errors :S – Ste Jul 26 '11 at 21:29
I have been directed to SO many times in the past when Googling and it has helped me out LOTS. This is a certain time I've had to participate though :) – Ste Jul 26 '11 at 21:34

Passing in parameters to jQuery .click

1 Answers1