Handling clicks for jQuery AJAX (with PHP)

Question

Not sure how to phrase this question exactly, but I'll give it a shot. (If you have a suggestion for how to phrase it better so others can find it, tell me and I'll edit it).

I want to know the best practices for handling clicks on a page that are then processed using AJAX. I have been temporarily using code that looks like this in the HTML:

<a href="#clickable">Click me!</a>

And in jQuery I handle the clicks by binding click to the href.

Of course, I know that you should not be making this known to the user.

So how should I be handling these clicks?

Answer 1

I'm not very sure to understand your question too xD

You can handle a click by doing something like

$("a").click(function() {
  // do some stuff
});

Does this answer to your question ?

Edit : Ok.

You just need to do something like this :

<a href='link' onClick='return MyClass.myFunction()'>keyword </a>

If I good remember, you return FALSE in JS to stay on the same page (and do some process with Ajax). If if JS is not activated, PHP will be used ;-)

Answer 2

You should make your HTML so that it works if Javascript is off. Don't mix content with functionality, so inline Javascript is usually not a good solution.

So, in your case:

<a href="some/working/path.php" class="ajax">Meaningful description!</a>

Then you can add a class (or check the text inside, or something else) to handle it on the Javascript side.

Make sure to use event.preventDefault() to stop the page from changing if Javascript is enabled.

So the jQuery would be

  // Target only anchors with class "ajax"
$("a.ajax").click(function(event) { 

    // Handle AJAX etc here.
    // ...

    event.preventDefault(); // <== Don't navigate away from page
});

Answer 3

I usually have the href link to a static php page, and then use javascript to change the link href to the ajax processing page, then you can reference it in the ajax call.