는 어떻게 jQuery를 대화 상자를 사용하여 양식을 납치하고 그 다음 나는 간단한 양식을 제출

Question

계속 : 나는 jQuery를 UI 대화 상자가 jQuery를 사용하고

<form id="cancel" method="post" action="/Controller/Cancel"> 
    <input class="submitbtn" type="submit" value="Go"> 
    ... 

. 내가하고 싶은 것은 폼 제출을 하이재킹하고 대화 상자를 표시하는 것입니다. 사용자가 대화 상자에서 '예'를 클릭하면 양식이 계속 전달되고 일반 페이지가 제출됩니다. '아니오'를 클릭하면 대화 상자가 취소됩니다.

$(document).ready(function() { 

$("#dialog").dialog({ 
    resizable: false, 
    autoOpen: false, 
    modal: true, 
    buttons: { 
     "Yes": function() { 
      // Not sure what to do here 
      $(this).dialog("close"); 
     }, 
     "No": function() { 
      $(this).dialog("close"); 
     } 
    } 
}); 

$('#cancel').submit(function (event) { 
    event.preventDefault(); 
    $('#dialog').dialog('open'); 

}); 

}); 

내 질문은, 내가 제출 코드는 대화의 응답에 따라 클라이언트에 참/거짓 돌려받을 방법은 다음과 같습니다

나는이 코드를 가지고있다.

도움을 주시면 감사하겠습니다.

Answer 1

여기에서 문제는 당신이 "예 내 $('#cancel').submit()를 사용할 때 "버튼 콜백에서 submit 이벤트가 다시 트리거되고 event.preventDefault()이 (가) 실제로 제출되는 것을 막습니다.

빠른 수정은 실제로 양식을 제출하기 전에 제출 이벤트를 바인딩 해제하는 것입니다. (데모 : http://jsfiddle.net/WQjFj/6/)

$("#dialog").dialog({ 
    resizable: false, 
    autoOpen: false, 
    modal: true, 
    buttons: { 
     "Yes": function() { 
      $('#cancel').unbind("submit").submit(); 
      $(this).dialog("close"); 
     }, 
     "No": function() { 
      $(this).dialog("close"); 
     } 
    } 
}); 

또 다른 해결책이 대답에서 찾을 수 있습니다 : Using jquery ui dialog to confirm action for form submission

Answer 2

대화 상자에서 직접 양식을 제출할 수 있습니다. 당신이 할 무엇 // 확실하지,

$("#cancel").submit(); 

을 넣어 가지고 그 다음에 당신이 본 수도 가이드입니다 :

http://www.jensbits.com/2009/08/10/modal-confirmation-dialog-on-form-submit-javascript-jquery-ui-and-thickbox-varieties/