1

Twitter ブートストラップを使用していくつかの水平タブを設定し、各タブ内にフォームをレンダリングしています。

<div class="tab-content">
  <div id="tab1" class="tab-pane active">
      <%= render :partial => "shipdr/websites/form", locals: {:@shipdr_website => shipdr_website} %>
  </div>
  <div id="tab2" class="tab-pane">
    Another form (not yet implemented)
  </div>
  <div id="tab3" class="tab-pane">
    Another form (not yet implemented).
  </div>
</div>

次に、shipdr/websites/form に次のものがあります。

<%= simple_form_for(@shipdr_website) do |f| %>
  <% if @shipdr_website.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@shipdr_website.errors.count, "error") %> prohibited this shipdr_website from being saved:</h2>

      <ul>
      <% @shipdr_website.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.input :name %>
  </div>
  <div class="field">
    <%= f.input :url %>
  </div>
  <div class="field">
    <%= f.input :api_key %>
  </div>
  <div class="actions">
    <%= f.submit nil, :class => "btn btn-primary" %>
  </div>
<% end %>

送信ボタンを「タブコンテンツ」領域の外に移動して、ユーザーが送信ボタンをクリックすると、3 つのフォーム領域すべてが送信されるようにします。すべてのフォームは同じモデルと同じアクションを使用しますが、フィールドは異なります。タブを使用していることを除いて、アイデアはウィザードに似ています。

送信ボタンを form_for ループの外に移動する方法と、1 つのボタンで 3 つのフォームを送信する方法を知っている人はいますか?

4

2 に答える 2

2

一度に 3 つのフォームを送信できるかどうかわかりません。しかし、これを行うことができます：

<div class="tab-content">
  <%= simple_form_for(@shipdr_website) do |f| %>
    <div id="tab1" class="tab-pane active">
      <%= render :partial => "shipdr/websites/form", locals => {:f => f, :shipdr_website => @shipdr_website} %>
    </div>
    <div id="tab2" class="tab-pane">
      Another form (not yet implemented)
    </div>
    <div id="tab3" class="tab-pane">
      Another form (not yet implemented).
    </div>
  <% end %>
</div>

入力だけを残して、パーシャルからそれを削除します。

<%= simple_form_for(@shipdr_website) do |f| %>
于 2012-06-21T22:41:22.613 に答える
0

それを行う最良の方法はJavascriptを使用することだと思います。ボタンを動かして、Ajaxを介して一度に3つのフォームを送信できます。Jqueryを使用する場合は、http：//jquery.malsup.com/formを使用できます。

于 2012-06-21T22:30:55.380 に答える