我有一个名为/index
的网页,您可以添加House
和Dog
。该页面空白但有一侧的链接,您可以单击以动态显示其中一个表单。这些形式属于他们自己的部分。
我会将Dog模型用于此问题/示例。 Dog
属于House
。
class Dog
attr_accessible :name, :primary_color, :secondary_color, :house_id.........
belongs_to :house
end
DogsController
def new
@dog = Dog.new
respond_to do |format|
format.js
end
end
狗/ _form.html.erb
<%= simple_form_for(@dog, :remote => true) do |f| %>
<%= render :partial => "shared/error_message", :locals => { :f => f } %>
<%= f.input :name %>
<%= f.input :primary_color %>
<%= f.input :secondary_color %>
<%= f.association :house, :prompt => "Select a House" %>
<%= f.button :submit, 'Done' %>
<% end %>
PagesController
def index
respond_to do |format|
format.html
end
end
页/ index.html.erb
<li><%= link_to "Dog", new_dog_path, :remote => true %></li>
<div id="generate-form">
</div>
狗/ new.js.erb
$("#generate-form").html("<%= escape_javascript(render(:partial => 'dogs/form', locals: { dog: @dog })) %>");
现在有时候,你可能正在添加一只狗,但需要在你可以继续之前添加它所在的House。现在它只是删除整个狗形式,如果你这样做。切换到其他表单时,如何保存这些字段的进度?当用户退出页面时怎么办?
答案 0 :(得分:1)
有很多方法可以做到这一点,这是我的。
首先,我将删除调用以从jQuery加载部分。这就是你的问题所在。因为每次加载表单时,它都会写一个新版本的表单。
相反,我会在html本身中加载它们,而不依赖于jQuery调用。然后允许jQuery调用只是切换一个隐藏/显示。像这样:
<div class="dog-form">
<%= render(:partial => 'dogs/form', locals: { dog: @dog }) %>
</div>
<div class="house-form">
<%= render(:partial => 'house/form', locals: { house: @house }) %>
</div>
然后,你的jQuery看起来像这样:
$("#toggle-dog-form").click(function(){ $(".dog-form").toggle() };
$("#toggle-house-form").click(function(){ $(".house-form").toggle() };
<强>更新强>
如果你真的需要确保那些表格是因为某些我没有听说过的外部原因而被新填充的。然后你可以在原始的jQuery调用中加入一个条件,看看是否已经填充了任何输入字段。