[英]jScroll for infinite-scrolling in Rails
我是Rails和javascript的新手。 我在Rails上開發了一個小型應用程序,該應用程序使用solr的黑子在數據庫中搜索產品。 我以前使用kaminari的分頁來顯示內容。 但是現在我想把它取下來,改為使用無限滾動。 我指的是下面的無限滾動器。 https://github.com/pklauzinski/jscroll我想將其集成到我的Rails應用程序中。 我該怎么做? 這是我的控制器代碼:
def show
if params[:name].nil?
@search = []
else
@search = Sunspot.search(Clothes) do
fulltext params[:name]
paginate :page => params[:page], :per_page => 24
order_by :maxprice
end
@results = @search.results
end
flash[:alert] = "Enter something!"
end
def autocomplete
list=[]
@res = Clothes.search do
fulltext params[:term]
paginate :page => 1, :per_page => 100
order_by :maxprice
end
@rest = @res.results
@rest.each do |brand|
list << {"label"=>brand.name, "value"=>brand.name, "id"=>brand.id}
end
respond_to do |format|
format.json{render :json=>list.to_json, :layout=>false}
end
end
end
這是我的查看代碼:
<div id="container">
<% for prod in @results %>
<div class="product">
<div class="image"><%= image_tag(prod.image, :alt => "logo", :size => "75x75") %> </div>
<div class="name"><h3> <%= prod.name %> </h3></div>
<div class="price"><h5>Old Price:</h5><%= prod.maxprice%></div><div class="price"> <h5>New Price:</h5><%= (prod.maxprice)-(prod.maxprice * prod.discount / 100) %></div>
</div>
<% end %>
<% else %>
<div class="notice"><%= flash[:alert] %></div>
<% end %>
</div>
還有自動完成和處理ajax的腳本代碼。
<script>
$(document).ready(function() {
$.ajax({
url : "shirts/first",
type : "GET"
});
$("#name").autocomplete({
source : "shirts/autocomplete",
autoFocus : false,
minLength : 1,
select : function(event, ui) {
document.getElementById("name").value = ui.item.value;
$.ajax({
url : "shirts/show?name=" + ui.item.value,
type : "GET"
});
}
});
});
</script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.