LightBox loaded with Ajax - problem

  1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: LightBox loaded with Ajax - problem

vizmedia pro asked 4 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){ } }); });

Daniel pro answered 4 years ago

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

Adrian Sawicki answered 4 years ago

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

vizmedia pro answered 4 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 answered 4 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?

ilivingston pro premium answered 8 months 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 pro premium commented 8 months 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'); }
Write
Create snippet
Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
vizmedia
Pro User
94Support score
9Questions 15Answers
0Snippets likes 0Snippets

We use cookies to offer you a better browsing experience, analyze site traffic, personalize content, and serve targeted advertisements. Read about how we use cookies and how you can control them by clicking "Cookie Settings." If you continue to use this site, you consent to our use of cookies.