a href combi with javascript onClick

Question

How do you make a javascript "onClick" and an html "a href" merge into one link? I want that when I click on the link the first step is the "onClick" and the second when the "onClick" is successed you redirected with the "a href" to another page.

1. First step: onClick="ajaxrequest('/includes/docx/boekenlijst.php', 'docgegevens')

and

2. Second step: a href="/Raymond_converters/docx/example.php">doc

I hope you can help me but my English is not so good. I'm sorry for that.

Answer 1

Using jQuery, you could try this:

<script type="text/javascript">
    $(document).ready(function() {
        var call_ajax = true;
        $('#alink').click(function(e) {
            if (call_ajax) {
                e.preventDefault();
                // Do AJAX
                call_ajax = false;
            }
        }
</script>

<a href="http://www.google.com" id="alink">google</a>

Answer 2

It's not simple, because if you let the link do its default action i.e. redirect to its href, the AJAX request won't be triggered.

What you need to do is:

1. Handle the onclick and cancel the default action by having return false;
2. When the AJAX request is done (in its success callback method) manually redirect the user to the link href location.

Answer 3

Try to use jquery with a dummy callback:


<a onclick="function1()" >function</a>

function function1(someVariable,function() {
          function2(someOtherVariable);
          window.location="http://www.yourpage.com/";   

})



function function2(someVariable, callback) {
  ...YUOR CODE HERE
  callback();
}