CODEWITHSUNDEEP
javascriptjqueryajax
Moshe Shaham
Moshe Shaham

Reputation: 15984

JavaScript - Logging just before a redirect

I'm trying to send an ajax call (for logging purposes) just before I redirect. Actually, the redirect is a download that has octet-stream and disposition set up properly. So the ajax call does not gets called on all browsers (particularly chrome). In others like IE it does. How can I make sure the call gets executed for SURE?

this is the code:

$(function() {
    $('#download-link-a').click(function() {
        remoteLog ('Clicked on download', '<?php echo $username; ?>' );
        location.href = "<?php echo $secure_link; ?>";
        return false;
    });
});
function remoteLog (arg, key) {
    var file = '/files/remoteLog.php';
    $.post(file, {text: arg, key: key});
}

Upvotes: 1

Views: 96

Answers (4)

Elliot B.
Elliot B.

Reputation: 17661

You need to use a callback function to invoke the redirect only after a successful POST. I suggest that you use $.ajax() instead of $.post() because it's more customizable.

Here's how you can turn your $.post() into an $.ajax() equivalent with the appropriate callback functions:

$(function() {
    $('#download-link-a').click(function() {
        remoteLog ('Clicked on download', '<?php echo $username; ?>' );
        return false;
    });
});

function remoteLog (arg, key) {

    var fnSuccess = function() {
        location.href = "<?php echo $secure_link; ?>";
    };

    var fnFail = function() {
        alert('POST failed. Do not redirect!');
    };

    $.ajax({
      type: 'POST',
      url: '/files/remoteLog.php',
      success: fnSuccess,
      error: fnFail,
      data: {text: arg, key: key},
      dataType: 'json',
      async:true
    });
}

More reading: jQuery.ajax()

Upvotes: 2

Yoann
Yoann

Reputation: 3060

I would go with a onbeforeunload and a synchrone ajax call.

$("#some-link").click(function(evt){
     this.outlink = $(this).attr("href");
     this.outtext = "Some text";
});

window.onbeforeunload = function(){
  data = {text:this.outtext,outlink:this.outlink};
  $.ajax({
    url:url,
    type:"POST",
    data:data,
    async:false
  });
};

In fact, your only problem is the async part of your ajax call.

Upvotes: 0

KooiInc
KooiInc

Reputation: 122906

Move the redirection to a callback function:

function remoteLog (arg, key) {
    var file = '/files/remoteLog.php';
    $.post(file, {text: arg, key: key})
      .always(function(){location.href = "<?php echo $secure_link; ?>";});
}

Upvotes: 1

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

$(function() {
    $('#download-link-a').click(function(e) {
        e.preventDefault();
        remoteLog ('Clicked on download', '<?php echo $username; ?>' );

    });
});
function remoteLog (arg, key) {
    var file = '/files/remoteLog.php';
    var jqPost = $.post(file, {text: arg, key: key})
    .always( function() { //or .done() can also be used
       location.href = "<?php echo $secure_link; ?>";
        return false;
    });
}

Upvotes: 0

Related Questions