tags:

views:

28

answers:

1

I want to be able to display the following code below only when a user clicks a specific link. Is it possible with JQuery? If so how would I be able to do this?

Here is my code.

    function signedIN(){
        $.ajax({
            type: "GET",
            url: "http://update.php",
            data: "do=getID",
            cache: false,
            async: false,
            success: function(result) {
                $("#status").text(result);
            },
            error: function(result) {
                alert("some error occured, please try again later");
            }
        });
    }
+2  A: 

Given a link with an ID of update:

<a id="update" href="update.php">Update</a>

Bind your signedIN() function to the link's click event:

$('#update').click(signedIN);

You'll need to add a return false; at the end of your function so the link doesn't actually proceed to update.php (the link's href value).

EDIT: here's a more complete code example so you can see how this all comes together:

function signedIN(){
    $.ajax({
        type: "GET",
        url: "http://update.php",
        data: "do=getID",
        cache: false,
        async: false,
        success: function(result) {
            $("#status").text(result);
        },
        error: function(result) {
            alert("some error occured, please try again later");
        }
    });

    return false;
}

$(document).ready(function() {

    // You probably have other jQuery code here, so just place this line somewhere
    $('#update').click(signedIN);

});
BoltClock
I'm kind of new to JQuery I cant seem to get this to work with my code :(
jphp
+1 for the return false. I didn't know you could do that.
Dan Williams
@jphp: I provided a more complete example, hope it helps.
BoltClock
@jphp: I created a live example for you here: http://jsfiddle.net/XztKV/1/
Felix Kling