[英]Rails link_to in bootstrap modals
I have do each loop for a bunch of items that users can vote on. 我为用户可以投票的一堆商品做每个循环。 The items are listed on the index page, with each item as a button that opens up a Bootstrap modal on click.
这些项目在索引页面上列出,每个项目都作为一个按钮,单击时可打开Bootstrap模式。 I want the user to be able to vote on the item within the modal, however I'm having difficulty accomplishing this.
我希望用户能够对模式中的项目进行投票,但是我很难做到这一点。 Here's what I have:
这是我所拥有的:
$(function () {
$(".box-inner").click(function() {
$('#modal_title').empty();
id = $(this).data('id');
url = window.location.origin + '/my_items/' + id + '/get_modal_content';
$.ajax({
cache: false,
type: 'GET',
url: url,
data: id,
complete: function() {
$.getJSON(url, function (data) {
$('#modal_title').append(data.name);
$('#myModal').attr("data-id", id);
});
},
success: function(data)
{
$("#myModal").modal('show');
}
});
});
});
Here is what the modal looks like: 模态如下所示:
<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
<h3 id="modal_title"></h3>
</div>
<div class="modal-body">
<div class="technique-info-section">
<h3>Info</h3>
<span class="thumbs-up">
<%= link_to like_my_item_path(**???**), method: :put, :remote => true do %>
<i class="fa fa-thumbs-o-up"></i>
<% end %>
</span>
<span class="thumbs-down">
<%= link_to dislike_my_item_path(**???**), method: :put, :remote => true do %>
<i class="fa fa-thumbs-o-down"></i>
<% end %>
</span>
</div>
</div>
</div>
</div>
</div>
And here is what the .each loop looks like: 这是.each循环的样子:
<% @techniques.each do |technique| %>
<li class="technique-box-outer">
<button class="box-inner" data-id="<%= technique.id %>">
<p class="technique-name"><%= technique.name %></p>
</button>
</li>
<% end %>
So in the two link_to paths in the modal, how can I get the link_to helper methods to have the correct item from the @techniques .each loop so that I can pass those params to my controller? 因此,在模态的两个link_to路径中,如何从@techniques .each循环中获取link_to帮助器方法以获取正确的项,以便将这些参数传递给控制器?
Just use it when you have it, and retain it for later, like so: 只需在拥有它时使用它,然后将其保留以备后用,就像这样:
<%= button_tag data: {id: technique.id, like_path: like_my_item_path(technique), dislike_path: dislike_my_item_path(technique) } do %>
<%= content_tag :p, technique.name, class: 'technique-name' %>
<% end %>
Then, in your js, you can do stuff like: 然后,在您的js中,您可以执行以下操作:
like_path = $(this).data('like-path');
dislike_path = $(this).data('dislike-path');
$("#myModal .thumbs-up a").attr('href', like_path)
$("#myModal .thumbs-down a").attr('href', dislike_path)
As a side-note, you may wish to bind the click to a higher-level element, to avoid issues with dynamic replacement ( like turbolinks, for example ). 附带说明一下,您可能希望将点击绑定到更高级别的元素,以避免动态替换( 例如turbolinks )的问题。 Something like this:
像这样:
$(document).on 'click', '.box-inner', function() {}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.