0

というページがあり、と/indexを追加できます。ページは空白で始まりますが、クリックしてフォームの 1 つを動的に表示できるリンクが側面にあります。これらのフォームは、独自のパーシャルにあります。HouseDog

この質問/例では、Dog モデルを使用します。Aは aDogに属しHouseます。

class Dog
 attr_accessible :name, :primary_color, :secondary_color, :house_id......... 
 belongs_to :house
end

犬コントローラー

def new
 @dog = Dog.new

 respond_to do |format|
  format.js
 end
end

Dogs/_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 %>

ページコントローラー

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 })) %>");

ただし、犬を追加している途中で、続行する前に家を追加する必要がある場合があります。現時点では、それを行うと、犬のフォーム全体が消去されます. 他のフォームに切り替えるときに、これらのフィールドの進行状況をどのように保存しますか? ユーザーがページを離れたときはどうなりますか?

4

1 に答える 1

1

これを行うには多くの方法がありますが、これが私の方法です。

まず、jQuery からパーシャルをロードする呼び出しを削除します。それがあなたの問題です。フォームが読み込まれるたびに、新しいバージョンのフォームが書き込まれるためです。

代わりに、jQuery 呼び出しとは関係なく、両方を html 自体にロードします。次に、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 呼び出しに入れることができます。

于 2012-06-17T15:49:50.943 に答える