Topic: LightBox loaded with Ajax - problem

vizmedia pro asked 7 years ago

Hi. LightBox dynamically loaded with Ajax not working: $.ajax ({ type: "GET", url: "/api/galeria/1, cache: false, data: "", success: function(html) { $(AnyContainer).html(html, $("#mdb-lightbox-ui").load("/mdb-addons/mdb-lightbox-ui.html")); }, error: function(html){ } }); });

ilivingston premium answered 3 years ago

I'm struggling with this a bit also. For example, I have a set of cached views stored in a JS object, and use pagination to swap out the views. Each cached view contains a carousel of images with an associated lightbox. Upon injecting the view into the view container, the lightbox is not initialized.

The lightbox does work on static views.

ilivingston premium commented 3 years ago

For what its worth; including the lightbox.js file and calling initPhotoSwipeFromDOM('.mdb-lightbox'); after the dynamic load seems to have resolved the issue. A bit deeper that I would like, and also not intuitive. I would have thought a recalling $("#mdb-lightbox-ui").load("/Content/mdb-addons/mdb-lightbox-ui.html"); should have done the trick.

my working code now looks like:

$(function() { ... $("#mdb-lightbox-ui").load("/Content/mdb-addons/mdb-lightbox-ui.html"); initPhotoSwipeFromDOM('.mdb-lightbox'); }

Adrian Sawicki free answered 7 years ago

To be honest I'm still not sure what you want to do. You want to download images by ajax or it's only about how to activate lightbox using ajax? Part of your page is using our lightbox and in another part, you want to activate it by ajax?

vizmedia pro answered 7 years ago

Part of the gallery page I want to load dynamically using Ajax (after loading the MDB files in the main template) After loading the gallery I need to activate the LightBox - I do not know how.

Adrian Sawicki free answered 7 years ago

Hello, Could you explain what are you trying to do and what effect would you like to attain? Regards, Adrian

Daniel pro answered 7 years ago

I have the same problem using the simplest (suggested on this website) initialization

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No