I've a js which makes $.ajax call, on success of which, I need to do something. Typical implementation would be like:

$.ajax({
    url: "/Sales/Quotations/LinkQuotabtleItemToSites",
    type: "POST",
    success: function (data) {
        // do something
    }
});

I've a js which makes $.ajax call, on success of which, I need to do something. Typical implementation would be like:

$.ajax({
    url: "/Sales/Quotations/LinkQuotabtleItemToSites",
    type: "POST",
    success: function (data) {
        // do something
    }
});

The issue is, this js function is developed by another developer and I've dependency on that ajax success call. I was wondering if there is a simple way to subscribe to the success event and handle it in my own js file

• javascript
• jquery
• ajax

Share Improve this question Follow edited Oct 23, 2015 at 5:35 Mahesh Kava asked Oct 23, 2015 at 5:19 Mahesh KavaMahesh Kava 79166 silver badges1616 bronze badges 5

• just want to confirm, it is the only Ajax call you want to hit through out the project? – Ram Singh Commented Oct 23, 2015 at 5:21
• as of now, yes but I don't know in the future if my logic would depend on other ajax calls (business rule change..you see) – Mahesh Kava Commented Oct 23, 2015 at 5:24
• 1 binaryintellect/articles/… try to follow the above – Ram Singh Commented Oct 23, 2015 at 5:25
• 2 "Subscribing" to the success event sounds like a horrible idea. "so we both are working independently and don't overwrite each others changes". I am sure that you really need to use version control. That's how programmers of the whole world work. Please, read these articles: stackoverflow./questions/1408450/… and stackoverflow./questions/2658/… – Yeldar Kurmangaliyev Commented Oct 23, 2015 at 5:31
• Thanks Ram for the link, is it possible to subscribe to a specific call, then having a global call back handler? – Mahesh Kava Commented Oct 23, 2015 at 5:33

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

ajaxSuccess will be your friend for that : https://api.jquery./ajaxSuccess/

Attach a function to be executed whenever an Ajax request pletes successfully. This is an Ajax Event.

$(document).ajaxSuccess(function(event, xhr, settings) {
  console.log('hello !');
});

But with this, you'll listen every ajax success event. So if you need to listen to only one request, you may need to do dhis :

$(document).ajaxSuccess(function(event, xhr, settings) {
  if (settings.url == '/foo/bar/somefile') {
      console.log('hello !');
  }
});

You may use custom events:

$('.my-link').click(function() {
  $.ajax({
    url: "/Sales/Quotations/LinkQuotabtleItemToSites",
    type: "POST",
    success: function(response) {
      $(document).trigger('mynamespace:mytrigger', [response]);
    }
  });
});

// Developer 1 listens:
$(document).on('mynamespace:mytrigger', function (event, response) {
  console.log('Listener 1 and response is:', response);
});


// Developer 2 listens in some other place:
$(document).on('mynamespace:mytrigger', function (event, response) {
  console.log('Listener 2 and response is:', response);
});