Event listener if div is reloaded

Question

In some AJAX query, in response.done I refresh some div and it works fine, the problem is this refresh doesn't refresh also another function(this function fill the content html() of another div inside the refreshed one). I'm thinking for a trick to add an event to listen when that div is reloaded, I lunch my getAmount() function.

I tried to add that function after reloading part in AJAX but it doesn't work.

file1.phtml

ajaxRequest = jQuery.ajax({
...
ajaxRequest.done(function (response, textStatus, jqXHR) {
    jQuery("#shopping-cart-table").load(location.href + " #shopping-cart-table"); //Here I reload my div.
});

file2.phtml

function getAmount() {
    var some = jQuery(this).attr('data-subtotal');
    jQuery('#shopping-cart-table .data').each(function(){
        jQuery('.ship-cart-vendor-header').each(function(){
            jQuery(this).find('.not-reached').html(some);
        });
    });
}

You may probably want to listen to the DOM changes: https://stackoverflow.com/questions/3219758/detect-changes-in-the-dom. — 31piy, Jul 19 '18 at 08:33
If you are listening for changes inside the replaced dom, then your event wont get a hit. It seems like what you want to do is bad practice. I think you should replace the element in the dom and then call the event in the .done functioner. Otherwise you could add $('body').on('change', '.yourElementClass', function(){ ... do something here ... }); — Martin M, Jul 19 '18 at 13:42
You are calling `load` inside an `ajax` success-handler. This will result in two requests sent to the server. Can't you directly use the first AJAX-response? — feeela, Jul 19 '18 at 13:45
@Martin M this: `var priceed = jQuery(".price").html(); $('body').on('change', priceed, function(){ alert('changed');});` doesn't work — prc, Jul 19 '18 at 14:12
@prc What is in the `response` of the first AJAX request? Why do you execute two requests to the server? — feeela, Jul 19 '18 at 14:50
@feeela because in my ajax url I call some controller who returns me the html page updated, this is why I have to update the content to get the new one — prc, Jul 19 '18 at 16:08

score 0 · Answer 1 · answered Jul 25 '18 at 16:08

0

You've to call your getAmount function in the load callback, what mean after the complete reloading :

jQuery("#shopping-cart-table").load(location.href + " #shopping-cart-table", function(){
    getAmount();
});

answered Jul 25 '18 at 16:08

Zakaria Acharki

66,747
15
75
101

I have already tested it but it doesn't work, in this case, I must wait when loading div is finished and after that I lunch `getAmount();` Im not able to detect when the load action div is finished ! – prc Jul 25 '18 at 16:54

Event listener if div is reloaded

1 Answers1