私はレールを初めて使用し、jquery を使用して独自の動的フィールドを実装しようとしています。フォームにフィールドを追加しても問題ありませんが、パラメーターが希望どおりに送信されません。これが私のjQueryです:
$('form').on('click', '#add_ingredient', function(){
count = 1;
field = $('#ingredient_list li').first()
.clone()
.find('input')
.val('')
.end()
.find('input')
.prop({id: 'entry_ingredients_attributes_' + count + '_name', name: 'entry[ingredients_attributes][' + count +'][name]' })
.end();
$('#ingredient_list').append(field);
count += 1;
})
これにより、複数のリスト項目を追加でき、それらの ID と名前がインクリメントされて一意になるようになります。
モデルが正しくセットアップされ、accepts_nested_attributes_for を使用できるようになりました。モデル Entry、Ingredient、および関連付け EntryIngredient を持つベーキング ジャーナルを作成しています。私の問題は次のとおりです。
フォームを送信すると、複数のフィールドを追加した場合でも、最後の 1 つだけが送信されます。これは、1 つ以上の成分を含むフォームを送信したときのパラメーターの出力です。
"ingredients_attributes"=>{"0"=>{"name"=>"Flour", "_destroy"=>"false"}, "1"=>{"name"=>""}}}}
これがどのように作成されているかを知りたい場合のために、私のフォームも示します。
<div id="ingredients">
<%= f.fields_for :ingredients, @entry.ingredients.build do |builder| %>
<%= render 'ingredient_fields', :f => builder %>
<% end %>
</div>
<div id='add_ingredient'>Add Ingredient</div>
<div class="actions">
<%= f.submit %>
#_ingredient_fields
<ul id="ingredient_list">
<li>
<%= f.label :name %>
<%= f.text_field :name %>
<%= f.hidden_field :_destroy %>
<%= link_to "Remove", "#", :class => "remove_fields" %>
</li>
</ul>
誰かが私を正しい方向に向けることができますか?
解決
以下の回答での Zaid Crouch の提案に従って、私のセレクターが正しいことをしていないことが判明しました。私のJSは次のようになりました:
$('form').on('click', '#add_ingredient', function(){
count = $('#ingredient_list li').length;
field = $('#ingredient_list li').first()
.clone()
.find('input')
.val('')
.end()
.find('input :first')
.prop({id: 'entry_ingredients_attributes_' + count + '_name', name: 'entry[ingredients_attributes][' + count +'][name]' })
.end()
.find('input :last')
.prop({id: 'entry_ingredients_attributes_' + count + '__destroy', name: 'entry[ingredients_attributes][' + count +'][_destroy]', value: 'false' })
.end();
$('#ingredient_list').append(field);
})
これらの要素を選択するためのより良い方法を誰かが推奨できる場合は、プロパティを変更しています。フィードバックをいただければ幸いです。