0

オブジェクト (@contacts) のリストを含むインデックス ページを取得しましたが、ajax を使用してポップアップ内のすべての @contact エントリを編集する機能が必要です。オブジェクトのリスト:

  <% @contacts.each do |contact| %>
    <div><%= contact.name %> | <%= link_to 'Edit', edit_contact_path(contact), :id => "edit_contact_dialog_link_#{contact.id}" %></div>
    <% @contact = contact %><%= render :template => "contacts/edit" %>
  <% end %>

ここでは、すべての編集リンクに一意の ID を追加しています。で同様に行うedit.html.erb

<div id="edit_contact_dialog_<%= @contact.id %>">
  <h1>Editing contact</h1>
  <%= render 'form' %>
</div>

インデックスページには、連絡先のリスト(一意の編集リンク付きedit_contact_dialog_link_ID)と編集フォーム(一意のdiv ID付きedit_contact_dialog_ID)があります

すべてのedit_contact_dialog_IDボックスを非表示にし、edit_contact_dialog_link_IDクリックするたびに対応するダイアログ ウィンドウを開く必要がありますが、方法がわかりません。

私のcontacts.js

  $("#edit_contact_dialog_(here i need a regexp or smthng?)").dialog({
    autoOpen: false,
    width: 455,
    modal: true
  });

  $("#edit_contact_dialog_link_???").click(function(){
    $("#edit_contact_dialog_???").dialog("open");
    return false;
  });

助けてくれてありがとう。

4

1 に答える 1

3

クラス属性を使用する

$(".dialog").dialog({
    autoOpen: false,
    width: 455,
    modal: true
});

$(".edit_handler").click(function(){
    var id = $(this).attr('id');
    $("#edit_contact_dialog_" + id).dialog("open");
    return false;
});
于 2012-06-08T09:57:53.710 に答える