bootstrap модальное окно внутри slick slider

$('.slider-product').each(function(){ 
  var $this = $(this); 
   
  $this.slick({ 
    slidesToShow: 2, 
    slidesToScroll: 1,                
    dots: false, 
    infinite: true,  
  });  
}); 
 
 
$(window).load(function(){ 
    $('.slider-product').each(function(){ 
        var $this = $(this); 
 
        $this.on('setPosition', function () { 
            $(this).find('.slick-slide').height('auto'); 
            var slickTrack = $(this).find('.slick-track'); 
            var slickTrackHeight = $(slickTrack).height(); 
            $(this).find('.slick-slide').css('height', slickTrackHeight + 'px'); 
        }); 
    });    
   
});

@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'); 
 
 
 
.tab-content>.tab-pane { 
    display: block !important;    
    height: 0 !important;          
    overflow: hidden !important; 
} 
.tab-content > .active { 
    height: auto !important;     
} 

<script src="https://code.jquery.com/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
   
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.css" /> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js"></script> 
 
 
  <ul class="slider-filter nav nav-tabs"> 
    <li class="active"> 
      <a href="#popular-1" data-toggle="tab"> 
        1 вкладка 
      </a> 
    </li>       
    <li> 
      <a href="#popular-2" data-toggle="tab"> 
        2 вкладка 
      </a> 
    </li>    
  </ul> 
   
   
<div class="tab-content"> 
  <div id="popular-1" class="tab-pane fade in active">   
    <div class="slider-product"> 
 
      <div class="item"> 
        <a href="#" class="product-buy-click" data-target="#modalClick" data-toggle="modal"> 
          1/ открыть модальное окно 
        </a> 
 
        <div class="order-modal modal fade" id="modalClick" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"> 
          <div class="modal-dialog" role="document"> 
            <div class="modal-content"> 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
                <i class="fa fa-times" aria-hidden="true"></i> 
              </button>     
              <div class="modal-body"> 
                1/ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus incidunt molestias quo nihil illum perspiciatis tempore! Sed necessitatibus a, eligendi. 
              </div> 
            </div> 
          </div> 
        </div>         
      </div> 
 
      <div class="item"> 
        <a href="#" class="product-buy-click" data-target="#modalClick" data-toggle="modal"> 
          2/ открыть модальное окно 
        </a> 
 
        <div class="order-modal modal fade" id="modalClick" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"> 
          <div class="modal-dialog" role="document"> 
            <div class="modal-content"> 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
                <i class="fa fa-times" aria-hidden="true"></i> 
              </button>     
              <div class="modal-body"> 
                2/ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus incidunt molestias quo nihil illum perspiciatis tempore! Sed necessitatibus a, eligendi. 
              </div> 
            </div> 
          </div> 
        </div>         
      </div> 
 
      <div class="item"> 
        <a href="#" class="product-buy-click" data-target="#modalClick" data-toggle="modal"> 
          3/ открыть модальное окно 
        </a> 
 
        <div class="order-modal modal fade" id="modalClick" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"> 
          <div class="modal-dialog" role="document"> 
            <div class="modal-content"> 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
                <i class="fa fa-times" aria-hidden="true"></i> 
              </button>     
              <div class="modal-body"> 
                3/ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus incidunt molestias quo nihil illum perspiciatis tempore! Sed necessitatibus a, eligendi. 
              </div> 
            </div> 
          </div> 
        </div>         
      </div> 
    </div> 
  </div> 
 
  <div id="popular-2" class="tab-pane fade"> 
    <div class="slider-product"> 
 
      <div class="item"> 
        <a href="#" class="product-buy-click" data-target="#modalClick" data-toggle="modal"> 
          1/ открыть модальное окно 
        </a> 
 
        <div class="order-modal modal fade" id="modalClick" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"> 
          <div class="modal-dialog" role="document"> 
            <div class="modal-content"> 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
                <i class="fa fa-times" aria-hidden="true"></i> 
              </button>     
              <div class="modal-body"> 
                1/ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus incidunt molestias quo nihil illum perspiciatis tempore! Sed necessitatibus a, eligendi. 
              </div> 
            </div> 
          </div> 
        </div>         
      </div> 
 
      <div class="item"> 
        <a href="#" class="product-buy-click" data-target="#modalClick" data-toggle="modal"> 
          2/ открыть модальное окно 
        </a> 
 
        <div class="order-modal modal fade" id="modalClick" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"> 
          <div class="modal-dialog" role="document"> 
            <div class="modal-content"> 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
                <i class="fa fa-times" aria-hidden="true"></i> 
              </button>     
              <div class="modal-body"> 
                2/ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus incidunt molestias quo nihil illum perspiciatis tempore! Sed necessitatibus a, eligendi. 
              </div> 
            </div> 
          </div> 
        </div>         
      </div> 
 
      <div class="item"> 
        <a href="#" class="product-buy-click" data-target="#modalClick" data-toggle="modal"> 
          3/ открыть модальное окно 
        </a> 
 
        <div class="order-modal modal fade" id="modalClick" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"> 
          <div class="modal-dialog" role="document"> 
            <div class="modal-content"> 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
                <i class="fa fa-times" aria-hidden="true"></i> 
              </button>     
              <div class="modal-body"> 
                3/ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus incidunt molestias quo nihil illum perspiciatis tempore! Sed necessitatibus a, eligendi. 
              </div> 
            </div> 
          </div> 
        </div>         
      </div> 
    </div> 
  </div> 
</div>