Slick Slider in Ajax Modal

[jarvis]

Hi All,

Am hoping someone can help!

I have a table on my page which has multiple rows. Each row has a button, clicking the button triggers a modal pop up (Bootstrap). Within the modal is various details and a gallery.

What I'm trying to do, is get the gallery to run as a carousel using Slick Slider.

My ajax function is below:

function fetch_post_data(post_id,vids)  {
	 
	var action = 'fetch_post_data';				
	
	$.ajax({
		url: blog.ajaxurl, 
		method: "POST",
		data: { action:action, post_id:post_id, vids:vids},
		success: function(data) {
			$('#productModal').modal('show');
			$('#post_detail').html(data);
		}
	});
}

Now, using the following code, I can get the slick slider carousel to work once the modal initially opens:

$('.modal').on('shown.bs.modal', function () {
  $('.slider-class').slick();
  $('.wrap-modal-slider').addClass('open');
});

The issue I'm having, is when you scroll to the next modal (hence using Ajax), the carousel won't run.

I'm guessing, I need to somehow merge the above function into the success: function(data){} code.

However, I simply can't get it to work.

Absolutely any help here  would be ace!

Thanks