Topic: Image lazyload don't refresh when page is refreshed using ajax request

Publipresse premium asked 1 year ago


Expected behavior Image magically reload when I refresh a part of a page containing image with ajax

Actual behavior Images disappears

Resources (screenshots, code snippets etc.) https://www.loom.com/share/af44cc9a58ba4ea4aa940f82c4a8df90


Publipresse premium answered 1 year ago


Not sure it's relevant cause it's linked to the CMS I use, but basically, this is an ajax call

function onChangeOffer(field) {
    var form = $(field.form);
    $.request('onAjax', {
        form: form,
        loading: $.oc.stripeLoadIndicator,
        update: {
            'product/images':'#images-wrapper',
            'product/price':'#price-wrapper'
        },
    });
}

the list under update option are partials (block containing html code) to be refreshed. Here is the content of partial product/images

<img class="lazy" data-mdb-lazy-src="{{ obProduct.preview_image.path|resize(700,false) }}" data-mdb-lazy-placeholder="{{ obProduct.preview_image.path|resize(70,false) }}" alt="{{ obProduct.preview_image.title }}" />

Grzegorz Bujański staff commented 1 year ago

Do you use some framework? This code doesn't look like it was written in plain JS


Grzegorz Bujański staff answered 1 year ago


I need an example to see how you are refreshing part of the page. Please create a snippet where this issue will occur.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • User: Premium
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: 3.2.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes