0

料理に関するページを作成していますが、「キッチン」（属性のみあります）を簡単に追加できるようにしたいnameので、[新しいキッチンを作成]リンクをクリックすると、新しいキッチンを作成するためのフォームが表示されます。クリックするたびにポップアウトするので、1つの送信ボタンをクリックするだけで複数のキッチンを作成できます。

kitchens#newアクションでjavascript形式を返すようにして、コントローラーでrespond_to do |format|jskitchens#newを実行し、new.js.erbファイルでjavacsriptを使用してフォームを追加することは可能でしょうか？またはそれを行う別の方法はありますか？

index.html.erb

<div class="createkitchendiv">


    <%= link_to "Create new kitchen", new_kitchen_path, :id => "createkitchenlink" %>


        <%= form_tag "/kitchen", :method => :post, :remote => true do %>

        <div class="blahblah">
        <%= render :partial => "box" %>

        </div>
        <%= submit_tag "Submit" %>

    <% end %>
    </div>

_box.html.erb（[新しいキッチンを作成]をクリックして目立たないようにページに追加できるようにしたい部分/フォーム。この設定がjsの有無にかかわらず機能するかどうかはわかりません。ありがとうございます。ヘルプ

4

2 に答える 2

1

もちろん、newアクションで必要なものを表示できます;-)

結果のフォームは次のようになります。

<form>
  <div id="container">
    <input type="text" name="kitchenname[]"/>
  </div>
  <input type="submit"/>
</form>

<input type="button" id="addNewInput" />

次に、jQuery を使用して -button をリッスンしaddNewInputます。クリックされたら、新しい<input type="text" name="kitchenname[]" />タグをcontainer-div に挿入します。

次に、送信ボタンをクリックすると、コントローラーは で配列を受け取りますparams[:kitchenname]。これを DB などに保存できます。

assets/javascripts/... フォルダー内に必要な JS コードを含めることができます。のクリック イベントをリッスンする単純な小さなリスナー#addNewInput。

編集: JS なしでこれを行うこともできますが、もう少し複雑になる可能性があります。add new input fieldコントローラーが以前よりも 1 つ多くの入力フィールドを出力する原因となる2 番目のボタンを作成する必要があります。さらに、ボタンを押す前にフィールドにあったすべての値を保持したい場合があります。

私はjQueryソリューションを使用します。とてもシンプルです (さらに Web 2.0) ;)

于 2013-03-03T22:53:52.867 に答える
0

また、Ajaxhttp ://railscasts.com/episodes/136-jquery-ajax-revisedでこのRailscastsの改訂エピソードをご覧になることをお勧めします。

あなたの問題は6:44分まで解決されます;）

于 2013-03-03T23:25:17.480 に答える