javascript - 通过 bootstrap 使用 jquery popover 进行 Rails CRUD

Question

我尝试将jquery popover添加到rails默认的cruds中，而不是重定向到 View ，我正在做的是在jquery popover中渲染表单:

<%= content_tag_for :tr, @order.order_items do |i| %>
<a class='btn btn-mini label-with-popover' id=<%=i.id%>><%= t('helpers.links.edit_html') %> </a>
<% end %>    

<script type="text/javascript">
    $(function () {
      $('.label-with-popover').popover({ 
        html : true,
        content: "<%= escape_javascript(render :partial => 'form_item') %>" , 
        placement:  'top'
      } );
    });
    </script>

这是我的 form_item:

<%= simple_form_for :order_item, url:  admin_shop_order_path,  :html => { :class => 'form-horizontal' } do |f| %>
  <div class='form-inputs'>
    <%= f.input :item_id , :collection => @shop.products.collect{|b| b.variants}.flatten.map{|variant| ["#{variant_full_title(variant)}", variant.id]}%> 
    <%= f.input :quantity %>
  </div>
  <div class="form-actions">
    <%= f.button :submit, :class => 'btn-primary' %>
    <%= link_to t("helpers.links.cancel"), admin_shop_orders_path, :class => 'btn' %>
  </div>
<% end %>

但问题出现在编辑按钮上。要呈现编辑表单，我们需要要编辑的对象(我的意思是:order_item)以及获取该对象的方法是使用 id，这就是我设置 anchor 标记 id 的原因。现在我们必须在 popover 函数中获取该 anchor id，但 $(this).id 不起作用。有什么建议吗？

Answer 1

在 jQuery 中，您需要使用 attr('id') 来获取元素的 id。尝试将 $(this).id 替换为:

$(this).attr('id')

有关更多详细信息，请参阅 jQuery 文档:http://api.jquery.com/attr/

但实现此目的的首选方法通常是使用数据属性。这是一种将数据从 View 传递到某些 JS 代码的简洁方法。您的链接将如下所示:

<a class='btn btn-mini label-with-popover' data-item-id=<%=i.id%>>...</a>

在你的 JS 文件中，你可以使用以下方法获取这个值:

$(this).data('item-id')

jQuery 的文档:http://api.jquery.com/data/