Laravel और अनंत स्क्रॉल

Question

मैं laravel पृष्ठांकन और अनंत स्क्रॉल संबंधित कोई प्रश्न है:

सबसे पहले, मैं इस है:

<div class="row"> 

<div id="boxes"> 

    @forelse($duels->results as $d) 

     <div class="col-span-4 box notizy"> 

      @include('versus.versus') 

     </div> 



    @empty 



    @endforelse 

</div> 

<div class="col-span-12"> 
    <div class="paginate text-center"> 
     {{$duels->links()}} 
    </div> 
</div> 

हम देख सकते हैं, मैं एक div है #boxes जिनमें divs .box शामिल है। पृष्ठांकन Laravel द्वारा निर्धारित है और लग रहा है इस तरह:

<div class="col-span-12"> 
    <div class="paginate text-center"> 
     <div class="pagination"> 
      <ul> 
       <li class="previous_page disabled"><a href="#">&laquo; Previous</a></li> 
       <li class="active"><a href="#">1</a></li> <li><a href="index.php?page=2">2</a></li> 
       <li class="next_page"><a href="index.php?page=2">Next &raquo;</a></li> 
      </ul> 
      </div>  
     </div> 
</div> 

तो अब, मैं एक पृष्ठांकन के बजाय एक अनंत स्क्रॉल रखना चाहते हैं। मुझे https://github.com/paulirish/infinite-scroll का उपयोग करके कैसे करना चाहिए?

यदि आपके कोई प्रश्न हैं तो मैं यहां रहूंगा!

पुनश्च: मैं कुछ चीजें की कोशिश की है, लेकिन कोई भी तरह से काम किया:

$('#boxes').infinitescroll({ 
    loading: { 
     finished: undefined, 
     finishedMsg: "<em>Congratulations, you've reached the end of the internet.</em>", 
     msg: null, 
     msgText: "<em>Loading the next set of posts...</em>", 
     selector: null, 
     speed: 'fast', 
     start: undefined 
    }, 
    state: { 
     isDuringAjax: false, 
     isInvalidPage: false, 
     isDestroyed: false, 
     isDone: false, // For when it goes all the way through the archive. 
     isPaused: false, 
     currPage: 1 
    }, 
    debug: false, 
    behavior: undefined, 
    binder: $(window), // used to cache the selector for the element that will be scrolling 
    nextSelector: "div.paginate li.active a", 
    navSelector: "div.paginate", 
    contentSelector: null, // rename to pageFragment 
    extraScrollPx: 0, 
    itemSelector: "div.notizy", 
    animate: false, 
    pathParse: undefined, 
    dataType: 'html', 
    appendCallback: true, 
    bufferPx: 40, 
    errorCallback: function() { }, 
    infid: 0, //Instance ID 
    pixelsFromNavToBottom: undefined, 
    path: undefined, // Can either be an array of URL parts (e.g. ["/page/", "/"]) or a function that accepts the page number and returns a URL 
    prefill: false, // When the document is smaller than the window, load data until the document is larger or links are exhausted 
    maxPage:undefined // to manually control maximum page (when maxPage is undefined, maximum page limitation is not work) 
}); 

GitHub पेज के उदाहरण के आधार पर (और जगह क्या की जगह किया जाना चाहिए), लेकिन वहाँ बिल्कुल कोई ऐसा करने से प्रभाव है।

Answer 1

मैं समाधान मिल गया है (आप के लिए, भविष्य के लोगों):

$('#boxes').infinitescroll({ 
    navSelector  : ".paginate", 
    nextSelector : ".paginate a:last", 
    itemSelector : ".box", 
    debug   : false, 
    dataType  : 'html', 
    path: function(index) { 
     return "?page=" + index; 
    } 
}, function(newElements, data, url){ 

    var $newElems = $(newElements); 
    $('#boxes').masonry('appended', $newElems, true); 

}); 

यह काम करता है क्योंकि:

• पृष्ठांकन laravel 4 द्वारा दिए गए है जैसे हम
से पहले देखा था
• लार्वेल में अंकन एक यूआरएल देता है ....? पृष्ठ = x

महत्वपूर्ण

बग आपके सामने आ जाएगा:

जब आप क्या अंतिम पृष्ठ होना चाहिए परे नीचे स्क्रॉल, तो आप शायद पाएंगे कि आप फिर से और और आखिरी ओवर पेज रही, सही मायने में पैदा कर रहा रखने अनंत स्क्रॉल।

इसे ठीक करने, (laravel फ़ोल्डर में) paginator.php के पास जाकर इस प्रकार इसे बदल:

if (is_numeric($page) and $page > $last = ceil($total/$per_page)) 
    { 
     return Response::error('404'); 
    } 

आशा है कि यह किसी को किसी दिन में मदद मिलेगी!

Answer 2

धन्यवाद इस समाधान के लिए बहुत अच्छा पैनकेक, यह अच्छी तरह से काम करता है। हालांकि मुझे लगता है कि लैरावेल 4 में, प्रतिक्रिया फ़ेसडे में अब कोई त्रुटि() विधि नहीं है, इसलिए App::abort('404', '...') या Response::make('...', 404) जैसे कुछ काम करेंगे। फाइल को नामांकित होने के बाद बस use Illuminate\Support\Facades\.. फ़ाइल में जोड़ना याद रखें।

मुझे लगता है कि ऐसा करने का एक क्लीनर तरीका संभवतः पेजिनेटर क्लास को विस्तारित करना और getCurrentPage फ़ंक्शन को लागू करना संभव है। इस तरह जब आप php composer.phar update करते हैं तो विक्रेता को मिटाया नहीं जाएगा जो विक्रेता निर्देशिका में फ़ाइलों को ओवरराइट कर सकता है।

Answer 3

एक और अनंत स्क्रॉल प्लगइन https://github.com/pklauzinski/jscroll के साथ इसे लागू करने का एक तरीका भी है।

मान लें कि आप एक साधारण ब्लेड दृश्य है:

<div class="scroll"> 
<ol> 
    @foreach($media as $m) 
     <li>{{$m->title}}</li> 
    @endforeach 
</ol> 

{{$media->links()}} 
</div> 

हम निम्नलिखित जे एस-कोड

<?=HTML::script('<YOUR PATH HERE>jquery.jscroll/jquery.jscroll.min.js');?> 
<script type="text/javascript"> 
$(function() { 
    $('.scroll').jscroll({ 
     autoTrigger: true, 
     nextSelector: '.pagination li.active + li a', 
     contentSelector: 'div.scroll', 
     callback: function() { 
      $('ul.pagination:visible:first').hide(); 
     } 
    }); 
}); 
</script> 

साथ अनंत स्क्रॉल प्राप्त कर सकते हैं

nextSelector संपत्ति में अगले पृष्ठ लिंक का चयन करेंगे अपनी डिफ़ॉल्ट लैरावेल पेजिंग, सामग्री चयनकर्ता केवल आवश्यक सामग्री का चयन करता है, और कॉलबैक फ़ंक्शन पेजिंग कॉन छुपाता है तम्बू (मुझे इसे मैन्युअल रूप से छिपाना पड़ा क्योंकि उनकी विशेषता पेजिंग चयनकर्ता मेरे लिए अमान्य प्रतीत होता है)। आप प्लगइन के होम पेज पर मोड विवरण पा सकते हैं।