我是Rails和javascript的新手。我在rails上用ruby开发了一个小应用程序,它使用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>