2009-09-20 14 views
1

사용자가 정보를 제출할 수있는 양식이 있습니다. 제출이 성공할 수도 있고 성공하지 못할 수도 있습니다.jQuery UI 양식 제출 후 대화 상자

두 경우 모두 성공했는지 여부를 사용자에게 알리는 대화 상자가 필요합니다.
페이지가 양식 제출시로드됩니다. Ergo, 페이지가 Ajax를 통해 제출되지 않았습니다.

나는 버튼/링크 등 를 클릭하여 대화 상자를 실행하는 방법을 알고하지만 어떻게 jQuery UI Dialog 후 양식 제출을 사용할 수 있습니까?

UPDATE는

나는 해결책을 발견했다. You can read the solution in this thread.

+0

방금 ​​업데이트를 보았습니다. :/내 대답을 nevermind :) –

답변

0

이벤트 처리기를 양식의 전송 이벤트에 바인딩 할 수 있어야합니다.

$("form_name_here").bind("submit", function(){$("dialog").open()}) 

또는 방법은 대화 상자를 보여주기 위해 무엇이든. 내 머리 꼭대기에서 나는 기억할 수 없다. 다른 옵션은 ajax를 사용하여 양식을 제출한다고 가정 할 때 jQuery 양식 플러그인을 사용하는 것입니다. 이를 통해 양식 제출과 관련된 모든 이벤트에 대해 메소드를 전달할 수 있습니다. 이전, 이후, 성공, 실패 등

+0

양식은 아약스를 사용하여 제출되지 않았습니다. 따라서 솔루션은 클릭 후 페이지 재로드 전에 대화 상자 만 표시합니다. – Steven

+0

페이지가 열릴 때 스크립트에서 대화 상자를 열려고 시도해야합니다. 서버 응답은 url 매개 변수를 추가하거나 스크립트에 변수를 설정하여 응용 프로그램의 상태 (신규, 실패, 성공)를 판별해야합니다. 당신이 아약스를 사용하지 않기 때문에 그것이 유일한 방법이라고 생각합니다. – ScottyUCSD

1

형식 = 'submit'을 사용하지 말고 jQuery 이벤트를 일반 단추에 바인딩하고 ajax를 통해 양식을 처리하십시오. ajax를 통해 결과를 얻으면 대화 상자에 ajax 요청의 결과를 표시하거나 (PHP가 대화 상자에 메시지를 생성 함) 성공했는지 여부를 확인한 다음 적절한 조치를 취하는 조건을 지정할 수 있습니다.

다음은 in을 사용하는 예입니다. (코딩이 조금 엉성함)

$(document).ready(function() { 
     $('#submit').click(function() { 
      name = $('#name').val(); 
      email = $('#email').val(); 
      number = $('#number').val(); 
      message = $('#message').val(); 
      $.post("contact.php", //PHP file to send POST to 
      { ajax: 'yes', name: name, email: email, number: number, message: message }, //POST fields to send 
      function(returned) { //What to do if the POST finishes. 'returned' is the value recieved back from the script. 
       if (returned == 'done') { 
        //PHP script returns the word 'Done' 
         alert('Submit successful'); 
        });     
       } else { 
        alert('An error has occured'); 
}});});});