表單提交之前的Ajax調用不起作用

我有一個Spring MVC - JSP web應用程序。在提交特定表單之前，我需要使用JS/jQuery填充文本值輸入，以便表單POSTed包含該信息。這個文本值是ajax調用的結果，應該在點擊提交按鈕但在表單數據發送給控制器之前完成。在我的JSP代碼中的相關片段如下：表單提交之前的Ajax調用不起作用

<script> 
       //Gets from model a new valid file code number 
       function getFileCodeNumber(res){ 
        $.ajax({ 
         type: "post", 
         url: "getFileCodeNumber", 
         cache: false, 
         data: { department: $("#department").val(), docType: $("#docType").val() }, 
         success: res, 
         error: function(){ alert('Error while request..');} 
        }); 
       } 
      </script> 

    <script> 
       $(function() { 
        //Other JS code 
        $("#submitForm").click((function(event) { 
         if($("#chkLanguage").prop('checked')){ 
            //some stuff 
         }else{ 
          getFileCodeNumber(function(data){ 
            //do some stuff with 'data' 
          }); 
         } 
        })); 
       }); 
      </script> 

    <form:form id="form" class="form-horizontal" method="post" action="AddDoc" commandName="document" enctype="multipart/form-data"> 
    <div class="row" style="text-align:center;"> 
        <input id="submitForm" type="submit" class="btn btn-primary btn-lg" name="commit" value="Finish"> 
       </div> 
       </br> 
      </form:form>

只是爲了讓你知道，在同一個JSP另一個觸發動作時調用Ajax調用的作品完美，但調用的時候，「點擊」函數會檢索一個警告錯誤，但在屏幕上顯示的時間少於1秒，因此我不能告訴你它說了什麼。順便說一句，Firebug拋出「NS_ERROR_NOT_AVAILABLE：提示由用戶中止」。請注意，我試圖替換「點擊」觸發器「提交」，發生的情況完全相同。我的猜測是在ajax調用完成之前提交表單，但我希望「提交」和「單擊」功能在發佈數據之前完成其工作。

是否有人有線索？

編輯：我發現我無法看到的警報是打印ajax調用的錯誤代碼。但是，我已經檢查了控制器的函數，該函數響應了這個調用，並且我已經看到它成功完成並檢索期望值。更重要的是，當我從同一個JSP中的另一個觸發器調用該函數時，它完美地工作。只是讓你看到控制器中的簡單代碼：

@RequestMapping(value = "getFileCodeNumber", method = RequestMethod.POST, headers = "Accept=*/*") 
    public @ResponseBody 
    String getFileCodeNumber(@RequestParam(value = "department", required = true) String department, 
      @RequestParam(value = "docType", required = true) String docType) { 
     int n = cdocs.getNewCode(department, docType); 
     if (n == 0) { 
      return "EEEE"; 
     } else { 
      char[] zeros = new char[4]; 
      Arrays.fill(zeros, '0'); 
      DecimalFormat df = new DecimalFormat(String.valueOf(zeros)); 
      System.out.println(df.format(n)); 
      return df.format(n); 
     }//END_IF 
    }//END_METHOD

任何想法？

來源

2013-11-27 Hauri

而不是按下submitbutton時執行您的JavaScript，使用一個正常的按鈕，並從腳本執行提交功能。

來源

2013-11-27 11:11:07 DusteD

你的意思是更換型= 「提交」適用於type = 「按鈕」，然後$（「形式」）。提交（），不是嗎？如果是這種情況，它不起作用...繼續檢索相同的錯誤... – Hauri

試一下：

function getFileCodeNumber(res) { 
    return $.ajax({ 
     type: "post", 
     url: "getFileCodeNumber", 
     cache: false, 
     data: { 
      department: $("#department").val(), 
      docType: $("#docType").val() 
     }, 
     success: res, 
     error: function() { 
      alert('Error while request..'); 
     } 
    }); 
} 

$("#submitForm").click(function (event) { 
    event.preventDefault(); 
    if ($("#chkLanguage").prop('checked')) { 
     //some stuff 
    } else { 
     getFileCodeNumber(function (data) { 
      //do some stuff with 'data' 
     }).done(function() { 
      $('#form').get(0).submit(); 
     }); 
    } 
});

來源

2013-11-27 11:27:52

你可以做這樣的事情：

function getFileCodeNumber(res){ 
    $.ajax({ 
     type: "post", 
     url: "getFileCodeNumber", 
     cache: false, 
     data: { department: $("#department").val(), docType: $("#docType").val() }, 
     success: res, 
     error: function(){ alert('Error while request..');} 
    }) 
} 

$(function() { 
    if($("#chkLanguage").prop('checked')){ 
     //some stuff 
     $("#form").submit(); 
    }else{ 
     getFileCodeNumber(function(data){ 
     //do some stuff with 'data' 
     }).done(function(){ 
      $("#form").submit(); 
     });; 
    } 
});

來源

2013-11-27 12:47:48 Merlin

表單提交之前的Ajax調用不起作用

回答

相關問題