Javascript 表单提交之前的Ajax调用不起作用

我有一个SpringMVC-JSPWeb应用程序。在提交特定表单之前，我需要用JS/jQuery填充一个文本值输入，以便发布的表单包含该信息。此文本值是ajax调用的结果，该调用应在单击submit按钮时，但在表单数据发送到控制器之前完成。 我的JSP中的相关代码如下所示：

    <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>

---

有什么想法吗？

不要在按下submitbutton时执行javascript，而是使用普通按钮并从脚本中执行submit功能。

尝试：

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();
        });
    }
});

---

你可以这样做：

函数getFileCodeNumber（res）{ $.ajax({ 类型：“post”， url:“getFileCodeNumber”， cache:false， 数据：{department:$（“#department”）.val（），docType:$（“#docType”）.val（）， 成功：res， 错误：函数（）{alert（'error while request..）；} }) } $（函数（）{ if（$（“#chkLanguage”）.prop（'checked'））{ //一些东西 $（“#表格”）.submit（）； }否则{ getFileCodeNumber（函数（数据）{ //用“数据”做一些事情 }).done（函数（）{ $（“#表格”）.submit（）； });; } }); 您的意思是将type=“button”替换为type=“submit”，然后再替换$（“form”）.submit（），是吗？如果是这样的话，它就不起作用了…继续检索相同的错误。。。

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();
        });
    }
});