如果客户端形式验证绕过/禁用，如何仅使用服务器端验证

Question

我正在使用jQuery验证https://jqueryvalidation.org/documentation/2/

我正在使用jQuery/ajax作为服务器端验证作为备份。问题是服务器端验证首先。它本来就是要成为备份，以防客户端验证绕过。除非需要，否则我该如何不工作？

<form id="supportForm">
$("#supportForm").validate({
        rules: {
            first_name: "required",
            last_name: "required",
            email: {
                required: true,
                email: true
            },
            mobile: {
                required: true,
                digits: true,
                minlength: 9
            },
            company: "required",
            'checkboxes[]': {required: true}   
        },
         messages: {
            first_name: "First name required",
            last_name: "Last name required",
            email: "Inalid email address",
            mobile: "Please enter only digits",
            company: "Company required",
            'checkboxes[]': "Select at least one service"
        }
});
    $('#consult').on('click', function(e) {
        e.preventDefault();
        var form = $('#supportForm').serialize();
        $.ajax({
            url: 'validate.php',
            type: 'POST',
            dataType: 'json',
            data: form,
            beforeSend: function() {
                $('.error-message').empty().hide();
                $('consult').prop('disabled', true);
                $('consult').val('Submitting...');
            }
        })
        .done(function (data) {
            if(!data.success) {
                $('.error-message').append(data.message).fadeIn();
                $('consult').prop('disabled', false);
                $('consult').val('Submit');

            } else {
                alert('success, process form');
            }
        })
         .fail(function (jqXHR, textStatus, errorThrown) {
            console.log(textStatus + ': ' + errorThrown);
            console.warn(jqXHR.responseText);
        });
    });

Answer 1

问题是服务器端验证首先发射。

这里的问题是您在提交表格之前没有验证表格。

jQuery验证挂钩在表单提交中，但是您自己手动序列形式(从而通过浏览器提交(。

您需要在$ .ajax之前调用jQuery验证form.valid()。

$('#consult').on('click', function(e) {
    e.preventDefault();
    if (!$('#supportForm').valid())
        return;
    var form = $('#supportForm').serialize();
    $.ajax({ ...

更多信息：https：//jqueryvalidation.org/valid/

Answer 2

您不应为AJAX使用单独的click处理程序。该插件包含称为submitHandler的选项，并且单击已被插件自动捕获。

替换默认提交。通过Ajax提交表格的正确位置 验证后。

$("#supportForm").validate({
    rules: {
        ....   
    },
    messages: {
        ....
    },
    submitHandler: function(form) {
        $.ajax({
            url: 'validate.php',
            type: 'POST',
            dataType: 'json',
            data: $('#supportForm').serialize(),
            ....
        }
        return false;
    }
});

请注意，该函数的参数称为form，因此将参数重命名或重命名您的变量。也无需使用.preventDefault()；同样，因为插件已经为您处理。