[JQUERY] 어떻게 JQuery와 콜백 양식 제출 후를 할까?

어떻게 JQuery와 콜백 양식 제출 후를 할까?

해결법

1. ---

   1.난 그냥 이런 짓을 -

   난 그냥 이런 짓을 -

    $("#myform").bind('ajax:complete', function() {
   
            // tasks to do 
   
   
      });
   

   그리고 상황이 완벽했다.

   보다 구체적인 세부 사항은이 API 설명서를 참조하십시오.

2. ---

   2.나는 안정적으로 작업에 솔루션을 upvoted 숫자 하나를 얻을 수 있지만,이 작품을 발견했다. 확실하지 그것을 필요 여부,하지만 난 POST가 $ 아약스 기능에 의해 처리됩니다 보장하고 당신에게 콜백 옵션을 제공합니다 태그에 액션이나 방법 속성이없는 것 경우.

   나는 안정적으로 작업에 솔루션을 upvoted 숫자 하나를 얻을 수 있지만,이 작품을 발견했다. 확실하지 그것을 필요 여부,하지만 난 POST가 $ 아약스 기능에 의해 처리됩니다 보장하고 당신에게 콜백 옵션을 제공합니다 태그에 액션이나 방법 속성이없는 것 경우.

   <form id="form">
   ...
   <button type="submit"></button>
   </form>
   
   <script>
   $(document).ready(function() {
     $("#form_selector").submit(function() {
   
       $.ajax({
        type: "POST",
         url: "form_handler.php",
         data: $(this).serialize(),
         success: function() {
           // callback code here
          }
       })
   
     })
   })
   </script>
   

3. ---

   3.당신은 서버에 AJAX 호출을 사용하여 수동으로 작업을 수행해야합니다. 이뿐만 아니라 형태를 오버라이드 (override) 할 필요합니다.

   당신은 서버에 AJAX 호출을 사용하여 수동으로 작업을 수행해야합니다. 이뿐만 아니라 형태를 오버라이드 (override) 할 필요합니다.

   하지만 케이크 한 조각이다, 걱정하지 마십시오. 다음은 폼 작업에 대한 갈 것입니다 방법에 대한 개요는 다음과 같습니다

   첫째, 당신은 양식과 같이 조치를 제출 취소해야합니다 :

   $("#myform").submit(function(event) {
       // Cancels the form's submit action.
       event.preventDefault();
   });
   

   그리고, 데이터의 값을 잡아. 하자 그냥 당신이 하나 개의 텍스트 상자가 있다고 가정합니다.

   $("#myform").submit(function(event) {
       event.preventDefault();
       var val = $(this).find('input[type="text"]').val();
   });
   

   그리고 요청 떨어져 발사. 그냥이 POST 요청의 가정 해 봅시다.

   $("#myform").submit(function(event) {
       event.preventDefault();
       var val = $(this).find('input[type="text"]').val();
   
       // I like to use defers :)
       deferred = $.post("http://somewhere.com", { val: val });
   
       deferred.success(function () {
           // Do your stuff.
       });
   
       deferred.error(function () {
           // Handle any errors here.
       });
   });
   

   그리고이 약을해야한다.

   주 2 : 폼의 데이터를 파싱를 들어, 당신이 플러그인을 사용하는 것이 바람직합니다. 그것은뿐만 아니라 모방 실제 양식 조치를 제출하는 좋은 의미를 제공하기 때문에, 정말 쉽게 당신의 인생을 만들 것입니다.

   참고 2 : 연기를 사용할 필요가 없습니다. 그냥 개인적인 취향입니다. 당신은 동등하게 다음을 수행 할 수 있으며, 너무 작동합니다.

   $.post("http://somewhere.com", { val: val }, function () {
       // Start partying here.
   }, function () {
       // Handle the bad news here.
   });
   

4. ---

   4.MVC를 들어 여기에 더욱 쉽게 접근이었다. 당신은 아약스 양식을 사용하고 AjaxOptions를 설정해야

   MVC를 들어 여기에 더욱 쉽게 접근이었다. 당신은 아약스 양식을 사용하고 AjaxOptions를 설정해야

   @using (Ajax.BeginForm("UploadTrainingMedia", "CreateTest", new AjaxOptions() { HttpMethod = "POST", OnComplete = "displayUploadMediaMsg" }, new { enctype = "multipart/form-data", id = "frmUploadTrainingMedia" }))
   { 
     ... html for form
   }
   

   여기에 제출 코드는이 양식을 제출하는 단추의 OnClick 이벤트, 문서 준비 섹션과의 관계에 있습니다

   $("#btnSubmitFileUpload").click(function(e){
           e.preventDefault();
           $("#frmUploadTrainingMedia").submit();
   });
   

   여기 AjaxOptions에서 참조하는 콜백입니다

   function displayUploadMediaMsg(d){
       var rslt = $.parseJSON(d.responseText);
       if (rslt.statusCode == 200){
           $().toastmessage("showSuccessToast", rslt.status);
       }
       else{
           $().toastmessage("showErrorToast", rslt.status);
       }
   }
   

   MVC를위한 제어기에있어서의 그것과 같다

   [HttpPost]
   [ValidateAntiForgeryToken]
   public JsonResult UploadTrainingMedia(IEnumerable<HttpPostedFileBase> files)
   {
       if (files != null)
       {
           foreach (var file in files)
           {
               // there is only one file  ... do something with it
           }
           return Json(new
           {
               statusCode = 200,
               status = "File uploaded",
               file = "",
           }, "text/html");
       }
       else
       {
           return Json(new
           {
               statusCode = 400,
               status = "Unable to upload file",
               file = "",
           }, "text/html");
       }
   }
   

5. ---

   5.나는 당신이 설명하는 것과 같은 콜백 기능이 믿지 않는다.

   나는 당신이 설명하는 것과 같은 콜백 기능이 믿지 않는다.

   여기에서 정상적인 것은 PHP와 같은 일부 서버 측 언어를 사용하여 변경을하는 것입니다.

   PHP에서는 예를 들어 양식에서 숨겨진 필드를 가져올하고있는 경우 일부 내용을 변경 할 수 있습니다.

   PHP :

     $someHiddenVar = $_POST["hidden_field"];
       if (!empty($someHiddenVar)) {
           // do something 
       }
   

   JQuery와에 대해 이동하는 방법 중 하나는 Ajax를 사용하는 것입니다. 대신) 기본 동작을 취소하고 jQuery.post를 (사용, 제출 반환 거짓을들을 수 있습니다. jQuery.post은 성공 콜백이 있습니다.

   $.post("test.php", $("#testform").serialize(), function(data) {
     $('.result').html(data);
   });
   

   http://api.jquery.com/jQuery.post/

6. ---

   6.양식의 양식을 제출하기 전에 핸들러가 호출 "에 제출". 양식이 submited 후 호출 될 핸들러가 있는지 모르겠어요. 기존의 비 자바 스크립트 의미에서 양식 제출 페이지를 다시로드합니다.

   양식의 양식을 제출하기 전에 핸들러가 호출 "에 제출". 양식이 submited 후 호출 될 핸들러가 있는지 모르겠어요. 기존의 비 자바 스크립트 의미에서 양식 제출 페이지를 다시로드합니다.

7. ---

   7.

   $("#formid").ajaxForm({ success: function(){ //to do after submit } });
   

from https://stackoverflow.com/questions/11534690/how-to-do-a-jquery-callback-after-form-submit by cc-by-sa and MIT license