0

ビューにリダイレクトする代わりに、jquery ポップオーバーを Rails のデフォルト cruds に追加しようとしましたが、jquery ポップオーバーでフォームをレンダリングしています。

<%= 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 を使用します。これが、アンカー タグ id を設定した理由です。ポップオーバー関数内でそのアンカー ID を取得する必要がありますが、$(this).id は機能しません。なにか提案を？

4

2 に答える 2

1

jQuery では、attr('id') を使用して要素の ID を取得する必要があります。$(this).id を次のように置き換えてみてください。

$(this).attr('id')

詳細については、jQuery のドキュメントを参照してください: http://api.jquery.com/attr/

ただし、これを実現するための推奨される方法は、通常、データ属性を使用することです。これは、ビューから一部の 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/

于 2013-07-28T13:29:09.307 に答える
1

あなたは間違ってレンダリングしていると思います。ローカルでパーシャルをレンダリングするようにしてください。ローカル変数をパーシャルに渡すこともできるので、より強力で柔軟になります。

あなたの場合、form_itemスクリプトタグでパーシャルをレンダリングしている間、次のように書くことができます：

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

フォームでは、次のようにアクセスできます。

<%= form_for(order_item) do %>

 # write your form stuff %>

<% end %>

このようにして、作成操作と編集操作の両方でフォームを処理できます。

最初に、テキストを追加して id を渡すことをお勧めします (id を に置き換えました"link_<%= i.id%>")。次に、a タグで onclick 関数を呼び出します。

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

最後になりましたが、関数で id を取得し、それをパーシャルに渡します。

<script type="text/javascript">
    function openPopup(a_id) {
      var id = a_id.split("link_")[1];
      $('.label-with-popover').popover({ 
        html : true,
        content: "<%= escape_javascript(render :partial => 'form_item', locals => {:id => id}) %>" , 
        placement:  'top'
      } );
    });
    </script>

私はjavascriptが苦手ですが、私の答えから、私があなたに説明したかったことがわかります。これを行うためのより改善された方法が見つかると確信しています。もしそうなら、ここにも投稿してください。それが役立つことを願っています。ありがとう

于 2013-07-28T13:42:51.453 に答える