jquery와 난간이있는 check_boxes를 사용하여 한 페이지에 여러 양식 제출

Question

문제점 : 페이지에 첫 번째 양식 만 제출합니다.

나는 수행 할 때 체크 박스를 클릭하여 확인할 수있는 할일이 있습니다.

내 부분에는 양식이 있습니다. todos가있는 것처럼 여러 번 렌더링되지만 다른 ID를 사용합니다. 양식에 체크 박스가 있습니다. 클릭하면 양식이 제출됩니다.

여기서 부분

<%= form_for todo, :remote => true, :html => {:id => "edit_done_todo_#{todo.id}"} do |f| %> 
    <%= f.hidden_field(:done_by_user_id,:value => current_user.id) %> 
    <%= f.check_box :completed, :class => "done_box", :id => todo.id %> 
<% end %> 

자바 스크립트

jQuery.fn.mark_todo_done = function(){ 
    var id = $(this).attr("id") 
    console.log(id) 
    $("#edit_done_todo_" + id).submit() 

}; 
$(document).ready(function() { 
$(".done_box").live("click", function() { 
    $(this).mark_todo_done(); 
    }) 
}) 

CONSOLE.LOG 올바른 ID를 표시한다. 그러나 페이지의 첫 번째 양식이 제출됩니다.

Answer 1

Railscasts는 jquery-ajax-revised (# 136)라고하는이 주제에 대한 훌륭한 캐스트를 제공합니다. 간단한 Do-list에 대한 기본적인 지식이 거의 포함되어 있습니다. (있을 경우)

$(document).ready(function() { 
    $('.edit_todo input[type=submit]').remove(); 
    $('.edit_todo input[type=checkbox]').click(function() { 
     $(this).parent('form').submit(); 
    }); 
    }); 

이 두 번째 라인은 당신이이 리뷰에서 버튼을 제출 제거의 의미 : 질문과 관련하여

, 모든 당신이 꽤 많이 필요가 다음과 같은 자바 스크립트입니다. 세 번째 줄은 실제로 체크 박스를 클릭하면 (클래스 이름이 edit_todo 인 경우 Chrome의 inspect 요소를 클릭하여 양식의 클래스 이름을 확인할 수 있습니다.) 네 번째 줄은 실제로 클릭하는 체크 박스에서 양식 요소를 가져옵니다. 그 양식을 제출하십시오.

본인의 질문에 대한 답변을 드렸습니다. 그렇지 않으면 귀하의 문제에 대한 자세한 설명을 드리고자합니다.