Lightgallery: Load Gallery with AJAX

[shamw4r]

When i get images with ajax its give me error " TypeError: a is undefined " But if i add hard code link of images like this in " dynamicEl:[{"src": "mlphotos/imgs/564d982d2bed1_kosta.jpg","thumb": "mlphotos/imgs/564d982d2bed1_kosta.jpg",}] " Then its working fine,

-> But i want to load images with ajax below are my code

Below are my code help me what is the issue here??

$.ajax({
url: "ajax_viewlarge_click" ,
type: 'POST',
dataType:"json",
success: function(data) {
//-------------------------
dynamicphoto = '';
for (var i = 0; i < data.length; i++) {
dynamicphoto += '{"src": "'+data[i]+'","thumb": "'+data[i]+'",},';
}
$.getScript($('#baseUrl').val()+"/application/layouts/scripts/themes/trailblazer/js/lg/lightgallery.min.js", function( datas, textStatus, jqxhr ) {
var pictures = "["+dynamicphoto+"]";
$(this).lightGallery({
dynamic: true,
html:true,
dynamicEl:pictures
});
});
},
error: function(e) {
console.log("Server failure! Is the server turned off?");
}
});

[sergiouve]

I think I'm experimenting a similiar issue. I initially load n images and issue an AJAX request on scroll to get more images. The five initial images work fine, but the new ones don't get the functionality (clicking on them just takes me to the url of the image).

I'm calling $('.container).lightGallery({ ... }); again on AJAX success: function(res) { ... }.

I'm also using the Wookmark plugin

[sergiouve]

I managed to solve this by properly destroying the gallery and loading it again on AJAX success: function(res) { ... }

Proper way to destroy the gallery:
$lg = $('.container');

// destroy
$lg.data('lightGallery').destroy(true);

[reillo]

We want to update the items while the gallery is opened. Say we have a load more or navigated to the end of current items.

Currently $lg.data('lightGallery').destroy(true); will close the gallery and re-instantiate the gallery. I've made a temporary workaround to fix this. see: https://github.com/reillo/rebuild-lightGallery

Could you tell me if you have a better work around of this scenario?

[sachinchoolur]

Hi @reillo ,
At present, it is not possible. But, I'll try to include a refresh method in future

[Tim-arts]

@sachinchoolur Any plan of this future method?