Rails在JQuery對話框中顯示信息

Question

我已經解決了這個問題，下面檢查修改後的代碼。 問題在於使用Jquery對話框構建單個頁面的創建，更新和刪除功能。 完整的工作代碼可以在這裏找到。 https://github.com/frozzie/ModalCrud

我正在研究單個頁面crud。

目前，我試圖讓顯示按鈕單擊顯示在對話框中的同一頁上的用戶信息，而不是在另一頁上。

我可以讓對話框工作，但我面臨數據顯示的問題。 彈出對話框，但信息丟失。

我想這可能是由於我的引用，因爲我仍然不能說我很熟悉Rails上不同文件格式的引用，但我不知道應該引用哪些變量名。

從本質上講，我的問題會得到的$對JavaScript的當量（ '＃<％= dom_id @用戶％>'）在.html.erb

下面是相關的代碼。

這是我在對話框中呈現的部分。 @user似乎沒有引用任何東西。 我試過$（'＃<％= dom_id @ user％>'），但我不太確定如何正確使用它。

<p> 
    <b>User name:</b> 
    <%= @user.user_name %> 
</p> 

<p> 
    <b>Email:</b> 
    <%= @user.email %> 
</p> 

<p> 
    <b>Password:</b> 
    <%= @user.password %> 
</p> 

<p> 
    <b>Account type:</b> 
    <%= @user.account_type %> 
</p> 

這是我show.js.erb

$("#show-form").dialog("open"); 

這是我的對話框代碼：

$("#show-form").dialog({ 
     autoOpen: false, 
     height: 400, 
     width: 350, 
     modal: true, 
     closeOnEscape: true, 
     resizable:false, 
     buttons: { 
      Cancel: function() { 
       $(this).dialog("close"); 
      } 
     } 
    }) 

這是我的形式，它會出現一個對話框上顯示的點擊。

<div id="show-form" title="User Information"><%= render :partial => "userinfo"%></div> 

任何幫助我如何能夠改變這個顯示對話框中的信息將不勝感激。

---

校正的代碼： 相反使其作爲部分的我包括內部的對話形式。 爲每個用戶呈現對話框的想法。

<tr id = "<%= dom_id user%>"> 
    <td><%= user.user_name %></td> 
    <td><%= user.email %></td> 
    <td><%= user.password %></td> 
    <td><%= user.account_type %></td> 
    <td><%= link_to 'Show', user, :remote=>true%></td> 
    <td><%= link_to 'Edit', edit_user_path(user), :remote => true %></td> 
    <td><%= link_to 'Destroy', user, :remote => true, method: :delete, data: { confirm: 'Are you sure?' } %> 
    </td> 
    <div id = "show-form"> 
    <p> 
    <b>User name:</b> 
     <%= user.user_name %> 
    </p> 

    <p> 
    <b>Email:</b> 
     <%= user.email %> 
    </p> 

    <p> 
    <b>Password:</b> 
     <%= user.password %> 
    </p> 

    <p> 
    <b>Account type:</b> 
     <%= user.account_type %> 
    </p></div> 
    </tr> 

這是對話框的JavaScript。

 $("#show-form").dialog({ 
     autoOpen: false, 
     height: 400, 
     width: 350, 
     modal: true, 
     closeOnEscape: true, 
     resizable:false, 
     buttons: { 
      Cancel: function() { 
       //$("#new_user")[0].reset(); 
       $(this).dialog("close"); 
      } 
     } 
    }) 

這發生在點擊上。

$("#show-form").dialog("open"); 

Answer 1

當你調用

$("#show-form").dialog("open"); 

你 「＃表演形式」 必須已經呈現在一個頁面。它可能是不可見的（「display：none;」），但它應該被瀏覽器知道。

因此，在用戶列表：

<% users.each do |user| %> 
    <div id="<%= dom_id(user) %>" title="User Information" style="display: none;"><%= render :partial => "userinfo", :user => user %></div> 
<% end %> 

在 「用戶信息」 改變 '@user' 到 '用戶'。

在任何JavaScript幫助創建通用對話框調用函數：

function show_as_dialog(dom_id) { 
    $(dom_id).dialog("open"); 
} 

而且鏈接「查看」（每個「用戶」）：

<%= link_to_function "Show", raw("show_as_dialog('#{dom_id(user)}')") %>