У меня есть шаблон лезвия, который отображает содержимое в разделе JScroll, а затем для каждого содержимого мне нужно загрузить модель (эта модель загружается), на этой модели мне нужно нажимать кнопки, которые отвечают на Javascript он должен генерироваться при загрузке новых данных после прокрутки, но проблема в том, что javascript перестает генерироваться, когда я продолжаю прокручивать страницу, чтобы кнопки продолжали работать.
Вот мои фрагменты кода
<div class="infinite-scroll">
<div class="row">
@foreach($products as $product)
<?php
try {
?>
<div class="col-md-2 col-sm-2" style="padding-bottom: 20px;">
<div class="propertycard">
<div class="property-image" data-toggle="modal" data-target="#{{$product->product_id}}">
<img src="/product_images/{{$product->image_name_one}}" width="100%" height="200px" alt="2ambale photo" style="border-top-right-radius: 0px; border-top-left-radius: 0px;" class="lazy img-responsive">
</div>
<br>
<div class="property-content" style="padding-left: 5px;">
<div class="listingInfo">
<div class="">
<p class="text-overflow"><a href="#" class="text-dark" style="text-transform: capitalize;" ><strong>{{App\Currency::currencyConveter($product->price)}}</strong></a></p>
</div>
<div class="">
<p class="text-overflow"><a href="#" class="text-dark" style="text-transform: capitalize;"> {{strtolower($product->name)}}</a></p>
</div>
</div>
</div>
</div>
</div>
@include("layouts.product_model")
<?php
} catch (\Exception $e) {}
?>
@endforeach
{{$products->links()}}
</div>
</div>
<script src="{{asset('js/jscroll.js')}}"></script><script type="text/javascript">$('ul.pagination').hide();$(function() {$('.infinite-scroll').jscroll({autoTrigger: true,loadingHtml: '<center><h2>Loading more {{$title}}...</h2></center>',padding: 0,nextSelector: '.pagination li.active + li a',contentSelector: 'div.infinite-scroll',autoTrigger: true,callback: function() {$('ul.pagination').remove();$('.lazy').lazy({effect: "fadeIn",effectTime: 2000,threshold: 0});}});});</script>