我在rails 4 app上使用这些行为作为可投票的宝石。
我终于使用ajax工作,因此当用户投票时页面不会刷新,但是,在刷新页面之前,vote.size不会更新。
这是我的控制器动作:
def upvote
@article = Article.find(params[:article_id])
@subarticle = @article.subarticles.find(params[:id])
session[:voting_id] = request.remote_ip
voter = Session.find_or_create_by(ip: session[:voting_id])
voter.likes @subarticle
respond_to do |format|
format.html {redirect_to :back }
format.json { render json: { count: @subarticle.get_upvotes.size } }
end
end
并查看:
<%= link_to like_article_subarticle_path(@article, subarticle), class: "vote", method: :put, remote: true, data: { type: :json } do %>
<button type="button" class="btn btn-success btn-lg" aria-label="Left Align" style="margin-right:5px">
<span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span> Helpful
</button><span class="badge" style="margin-right:10px"><%= subarticle.get_upvotes.size %></span>
<% end %>
<script>
$('.vote')
.on('ajax:send', function () { $(this).addClass('loading'); })
.on('ajax:complete', function () { $(this).removeClass('loading'); })
.on('ajax:error', function () { $(this).after('<div class="error">There was an issue.</div>'); })
.on('ajax:success', function(e, data, status, xhr) { $(this).html("Thank you for voting!"); });
</script>
截至目前,当用户投票时,它完全摆脱了“有用”按钮和upvote大小,并显示html“感谢投票”。
我无法弄清楚如何保留按钮并简单地将upvote.size更新为正确的数字。我已经尝试将一个类分配给upvote大小,然后使用类似这样的东西:$('.item-class').html(data.count)
但没有运气。
有什么建议吗?谢谢!
答案 0 :(得分:0)
$('.item-class').html(data.count)
item-class似乎没有在你的模板中声明任何地方...但即使它确实如此,如果你这样称呼它,它可能会匹配页面上的多个东西,所以这个替换赢了'工作。
更换按钮的原因是你要替换“this”的html(它被定义为标有类.vote的整个部分)
如果你想只更换.vote部分中的item-class(即保持按钮完好无损),那么你需要a)添加“item-class”类的东西,b)减少你要替换的内容那个。例如:
$(this).first('.item-class').html("Thank you for voting!");
(注意我没有对此进行错误测试 - 您可能需要首先使用google javascript来确保这是正确的用法。)