0

我已经解决了这个问题，检查下面的修改后的代码。问题在于使用 Jquery 对话框构建单个页面的创建、更新和删除功能。完整的工作代码可以在这里找到。 https://github.com/frozzie/ModalCrud

我正在处理单页杂物。

目前，我正在尝试让显示按钮单击以在对话框的同一页面上而不是在另一个页面上显示用户信息。

我可以让对话框正常工作，但在显示数据时遇到问题。对话框弹出，但信息丢失。

我认为这可能是由于我的引用，因为我仍然不能说我熟悉在 Rails 上跨不同文件格式的引用，但我不确定我应该引用哪些变量名。

本质上，我的问题是在 .html.erb 中获得相当于 $('#<%= dom_id @user%>') 的 javascript

以下是相关代码。

这是我在对话框中渲染的部分。@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" );
4

1 回答 1

1

你打电话时

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

您的“#show-form”必须已经在页面中呈现。它可能是不可见的（“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)}')") %>
于 2012-12-17T12:14:06.240 回答