私はjqueryでRailscastsのビデオを見ていましたが、いくつかのコードに出くわしました。todoリストアプリを作っています。ここに私のjqueryコードがあります:
リスト.js
$(function () {
$('.edit_task input[type=submit]').remove();
$('.edit_task input[type=checkbox]').click(function () {
console.log(this);
});
});
私は list/show.html.erb ファイルを持っています:
<h3>Unfinished Tasks</h3>
<div class="tasks" id="incomplete_tasks">
<% @list.tasks.incomplete.each do |task| %>
<%= form_for [current_user, @list, task], remote: true do |f| %>
<%= f.label :completed, class: 'checkbox' do %>
<%= f.check_box :completed %>
<%= task.description %>
<% end %>
<%= f.submit "Update" %> <!--We hide this button in jquery-->
<% end %>
<% end %>
</div>
<h3>Finished Tasks</h3>
<div class="tasks" id="completed_tasks">
<% @list.tasks.completed.each do |task| %>
<%= form_for [current_user, @list, task], remote: true do |f| %>
<%= f.label :completed, class: 'checkbox' do %>
<%= f.check_box :completed %>
<%= task.description %>
<% end %>
<%= f.submit "Update" %> <!--We hide this button in jquery-->
<% end %>
<% end %>
</div>
したがって、これにより次の html コードが生成されます。:
<div class="tasks" id="incomplete_tasks">
<form accept-charset="UTF-8" action="/users/4/lists/12/tasks/23" class="edit_task" data-remote="true" id="edit_task_23" method="post">
<label class="checkbox" for="task_completed">
<input name="task[completed]" type="hidden" value="0" /><input id="task_completed" name="task[completed]" type="checkbox" value="1" />
Read for exam
</label>
<input name="commit" type="submit" value="Update" /> <!--We hide this button in jquery-->
</form>
<form accept-charset="UTF-8" action="/users/4/lists/12/tasks/24" class="edit_task" data-remote="true" id="edit_task_24" method="post">
<label class="checkbox" for="task_completed">
<input name="task[completed]" type="hidden" value="0" /><input id="task_completed" name="task[completed]" type="checkbox" value="1" />
Eat healthy food
</label>
<input name="commit" type="submit" value="Update" /> <!--We hide this button in jquery-->
</form>
気がつけば、
<input name="task[completed]" type="hidden" value="0" /><input id="task_completed" name="task[completed]" type="checkbox" value="1" />
両方のフォームで同じ id="task_completed" を持っています。したがって、2 番目のリスト (フォーム) のテキストをクリックすると、最初のフォームが選択されます。どうすればこれを回避できますか? これを行うための特定の「Railsの方法」はありますか? 私を助けてください 。
編集:したがって、問題は、異なるフォームの両方の入力が、このコードを使用してレールによって自動的に作成される同じ id を持っていることです
<%= f.check_box :completed %>
では、フォーム/入力タグごとに一意のIDを持つように、RailsでIDの作成をオーバーライドするにはどうすればよいですか?