14

इस समाधानअंतहीन स्क्रॉलिंग के साथ will_paginate | Rails4

तो मैं will_paginate/Bootstrap Will Paginate उपयोग कर रहा हूँ अंतहीन स्क्रॉल के साथ है।

पृष्ठांकन काम कर पाने के लिए:

1.) मेरी नियंत्रक में मैं अपने सूचकांक दृश्य

@clips = Clip.order("created_at desc").page(params[:page]).per_page(20) 

2.) संपादित साथ मेरी सूचकांक कार्रवाई अद्यतन:

<%= will_paginate @clips%> 

अंकन ठीक काम करता है।

To Add Endless scrolling मैंने अपने पिछले रेल 3 ऐप के समान कदम उठाए।

1.) संपादित मेरी clips.js.coffee

jQuery -> 
$('#clips-masonry').imagesLoaded -> 
    $('#clips-masonry').masonry itemSelector: ".clips-masonry" # Thats my Masonry 

if $('.pagination').length # Thats for the Endless Scrolling 
    $(window).scroll -> 
     url = $('.pagination .next_page a').attr('href') 
     if url && $(window).scrollTop() > $(document).height() - $(window).height() - 50 
      # What to do at the bottom of the page 
      $('.pagination').text("Fetching more Clips...") 
      $.getScript(url) 
     $(window).scroll() 

2.) के साथ एक index.js.erb बनाएँ:

$boxes = $('<%= j render(@clips) %>') 

$('#clips-masonry').append($boxes).imagesLoaded(function(){ 
    $('#clips-masonry').masonry('reload'); 
}); 
<% if @clips.next_page %> 
    $('.pagination').replaceWith('<%= j will_paginate(@clips) %>'); 
<% else %> 
    $('.pagination').remove(); 
<% end %> 

3.) मेरे नियंत्रक सूचकांक कार्रवाई में प्रारूप.जेएस जोड़ा गया

def index 
    @clips = Clip.order("created_at desc").page(params[:page]).per_page(12) 
    respond_to do |format| 
     format.html 
     format.js 
    end 
end 

4.) मेरे _clip.html.erb div

<div class="clip-box clips-masonry" data-no-turbolink> 
+0

समस्या क्या है? अंतहीन स्क्रॉल पेजिनेशन कोड काम करेगा (हालांकि यह टर्बोलिंक अनुकूल नहीं है) - अगर आप अपनी त्रुटि सूचीबद्ध करते हैं तो आपको कुछ अंतर्दृष्टि मिल सकती है। – trh

+0

समस्या यह है कि यह काम नहीं कर रहा है :), कोई त्रुटि नहीं है, अंतहीन काम नहीं कर रहा है :(मुझे लगता है कि इसे प्रारूप.जेएस के साथ करना है कि मुझे अपने नियंत्रक में शामिल करना होगा। लेकिन रेल 4 में नियंत्रक बदल गया और मैं इसे काम पर नहीं ला सकता। –

+0

यह मेरे लिए ठीक काम करता है, मैं अभी भी format.js के साथ answer_to ब्लॉक का उपयोग कर रहा हूं। आपके लॉग में एचटीएमएल कॉलिंग क्या है, एचटीएमएल? कुछ क्लिप 'पेज = 2 'क्लिप कंट्रोलर # इंडेक्स के रूप में एचटीएमएल' के साथ? – trh

उत्तर

7

ठीक से लपेटा जाता है, मैं इसे अपने अपडेट किया गया प्रश्न के साथ काम मिला है, हर किसी को इस समस्या पर ठोकर, यह समाधान है।

संबंधित मुद्दे