Question

注意：我不想使用ajax提交，但要使用ajax进行验证，然后，如果成功，请提交。但它没有用。

我有一个带有action某些Django网址的HTML表单。现在，要在Web端验证它，然后在服务器端验证它，我这样做：

jQuery。validate()表单如果有效，则启用ID为submit的按钮。此按钮没有name=属性。
该按钮是一个普通按钮type="button"。我将其ajax表单数据（$('#formManager').serialize()）单击到名为verifyScript的URL以进行服务器端验证。此函数返回Django JSONResponse作为结果。
在success: function(returned, status, xhr){}处理程序中，我想使用$('#formManager').submit()提交表单;在这个动作中，我重定向到其他页面。但表格未提交。执行JS代码，但没有任何反应，也没有重定向。 async设置为false。

我的模板表单：

<form role="form" enctype="multipart/form-data" method="post" id="formManager" onsubmit="activate(this)" action=
    {% if action == "edit" %} 
        "{% url 'modifyScript' %}"
    {% elif action == "create" or action == "copy" %}
        "{% url 'createScript' %}"
    {% endif %}
>
...
<button type="button" id="submit"  class="btn btn-success">
    {% if action == 'edit' %}
        Edit Script
    {% elif action == 'create' %}
        Create Script
    {% elif action == 'copy' %}
        Copy Script
    {% endif %}
</button>

jQuery代码：

$(document).ready(function() {
....

/* remove the "disabled" attribute when we submit the form when editing */
function activate(form) {
    $(form).find("select").each(function(i, e) {
        if ($(e).disabled == true) {
            $(e).prop("disabled", false);
        }
    });
    var input = $(form).find("#machine");
    if (input.prop("disabled") == true) {
        input.prop("disabled", false);
    }
}

$('#submit').click(function(){
    $.ajax({
        type:       "POST",
        url:        "{% url 'verifyScript'%}",
        data:       $('#formManager').serialize(),
        dataType:   "json",
        async:      false,
        success:    submitForm

    })
});
});

});

function submitForm(returned, status, xhr) {
    var success = returned['success'];
    if (success) {
        $("#formManager").submit();
        return;
    } else {
        $('#verifyError').html(returned['errorMsg']);
        $('#myModalVerify').modal('show');
        return;
    }
}

我认为这是一个众所周知的问题。我看过类似的问题，但没有一个解决方案有效。例如this和this，但他们无法解决我的问题。

但是检查这些问题激励我注意：

将success回调提取为可分离的可调用对象，不包含()和参数;
在所述可调用

return

确保同一页面中没有name="submit"的元素
确保将按钮类型设置为type="button"，以防止在验证之前调用表单操作。

但它仍未提交。

EDIT1：

将async更改为false。

我创建this JSFiddle示例尝试使用真实代码显示，但验证和提交似乎不可能（如果有人可以嘲笑这个请随时更新）。主要思想是一个表格，其中一些禁用字段需要经过ajax验证，如果返回结果包含＆＃34;成功＆＃34;，我们提交它。并且，在提交时，我们需要在将数据发送到服务器之前激活禁用的字段，因此我们有onsubmit函数。

我已经弄明白了：onsubmit应该返回true来提交表单。，但我需要一些更多的启示：为什么？

jQuery ajax - 使用ajax验证，如果没有错误，请提交表单并重定向

0 个答案: