使用Ajax编辑表行的正确方法是什么?

时间:2010-10-29 21:50:11

标签: ruby-on-rails ajax

我浏览了一些标题相似的帖子,但没有找到答案。

在我的应用程序中,我想允许从索引视图编辑活动记录。此视图对每一行使用link_to_remote。当用户按下链接时,该行应替换为用户可通过Ajax提交的表单。

通过向show_item partial

发送集合来显示表格
<% content_tag_for(:tr, show_item) do %>
<td><%=h show_item.name %> </td>
<td><%= show_item.role %></td>
<td><%= link_to_remote 'Edit', :url => edit_participation_path(show_item), :method => :get %> </td>
<% end %>

我的控制器实现编辑为

   def edit
     @participation = Participation.find(params[:id])
     respond_to do |format|
       format.js do
         render(:update) { |page| page[@participation].replace_html(:partial => "edit_item", :object => @participation ) }
       end
     end
    end

Edit_item部分看起来像

<% content_tag_for(:tr, edit_item) do %>
  <% form_remote_for edit_item do |f| %>
     <td><%= edit_item.name %></td>
     <td> <%= f.select(:role, options_for_select(all_roles, edit_item.role)) %> </td>
     <td><%= submit_tag 'Update', :class => 'submit' %></td>
     <td><%= link_to_remote 'Cancel', :url => participation_path(edit_item) %></td>
   <% end %>
 <% end %>

远程调用会通过,但会以意外的方式影响表。在Firefox中按下链接会导致行消失。另一方面,如果我使用Safari,则更新行,但不是将单元格与其他表格行对齐,而是将整个替换的行放置在其他行的左侧。

有什么想法吗?

2 个答案:

答案 0 :(得分:0)

首先想到的是html中的语法错误。我注意到你的编辑部分有4个标签,但是show部分只有3个标签。您可能希望从Firebug查看生成的源并对其进行验证。

答案 1 :(得分:0)

您使用的是任何模板吗?当你使用link_to_remote时,如果你使用的话,它会用模板加载结果。

使用firebug插件检查源代码,并确认结果中的代码是否完全符合您的要求。