jQuery表单验证在使用文件上载时不发布

时间:2015-07-22 21:15:39

标签: javascript jquery ajax file-upload

我一直在使用jQuery Validate插件一段时间没有问题,但不是我试图将它与文件上传一起使用它不起作用。

我没有收到任何帖子,页面只是重新载入太快,让我看不到出现的“非法”错误。

jQuery如下:

_validateModalForm = function(formID, modalShow){
    var mesContainer = "#modal-message";
    $("#" + formID).validate({
        invalidHandler: function () { //display error alert on form submit              
            EMPGlobal.showAlert(mesContainer, '', 'danger', 'There was an error, please check the form, correct, and try again.' , '', '', '', 'warning');
        },
        submitHandler: function (form){ 
            var formData = form;
            formData = new FormData(formData);
            console.log(formData);
            $.ajax({
                url: 'includes/pages/leads.php?',
                //data: $(form).serialize(),
                data: formData,
                mimeType: "multipart/form-data",
                type: "POST",
                success: function (result) {
                    $.each(result, function(item, value){
                        if( (item == 'Success') || (item == 'Warning') ){
                            if(item == 'Success'){
                                var alertType = 'success';
                            } else {
                                var alertType = 'danger';
                            }
                            modalShow.modal('toggle');
                            EMPGlobal.showAlert('', '', 'success', value, '', '', '', alertType);
                            $('#lead-report-range').change(); //Reset the boxes
                        }
                    });
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    returnMes = $.parseJSON(jqXHR.responseText);
                    message = 'A ' + jqXHR.status + ' ' + errorThrown + ' error occurred. <br /> <i>Message Details: ' + returnMes + '</i>';
                    EMPGlobal.showAlert(mesContainer, '', 'danger', message, '', '', '', 'warning', jqXHR.status);
                },
            });
            return false;
        }
    });

    $("#" + formID + " input[required='required']").each(function(){
        $(this).rules( "add", {
            required: true,
            minlength: 2
        });
    });
};

它验证正确,但不会发布Ajax。

对此的任何帮助将不胜感激。我确信我缺少一些简单的东西。

更新

错误如下:

Uncaught TypeError: Illegal invocation
n.param.e @ jquery-1.11.0.min.js:4
Wc @ jquery-1.11.0.min.js:4
n.param @ jquery-1.11.0.min.js:4
n.extend.ajax @ jquery-1.11.0.min.js:4
$.validate.submitHandler @ leads.js:157
d @ VM16566:4(anonymous function) @ VM16566:4
n.event.dispatch @ jquery-1.11.0.min.js:3
n.event.add.r.handle @ jquery-1.11.0.min.js:3

1 个答案:

答案 0 :(得分:0)

在charlietfl的帮助下成功实现了这一目标。

_validateModalForm = function(formID, modalShow){
    var mesContainer = "#modal-message";
    $("#" + formID).validate({
        invalidHandler: function () { //display error alert on form submit              
            EMPGlobal.showAlert(mesContainer, '', 'danger', 'There was an error, please check the form, correct, and try again.' , '', '', '', 'warning');
        },
        submitHandler: function (form){ 
            var formData = new FormData($(form)[0]);
            $.ajax({
                url: 'includes/pages/leads.php?',
                //data: $(form).serialize(),
                data: formData,
                type: "POST",
                dataType: "json",
                cache: false,
                contentType: false,
                processData: false,
                success: function (result) {
                    $.each(result, function(item, value){
                        if( (item == 'Success') || (item == 'Warning') ){
                            if(item == 'Success'){
                                var alertType = 'success';
                            } else {
                                var alertType = 'danger';
                            }
                            modalShow.modal('toggle');
                            EMPGlobal.showAlert('', '', 'success', value, '', '', '', alertType);
                            $('#lead-report-range').change(); //Reset the boxes
                        }
                    });
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    returnMes = $.parseJSON(jqXHR.responseText);
                    message = 'A ' + jqXHR.status + ' ' + errorThrown + ' error occured. <br /> <i>Message Details: ' + returnMes + '</i>';
                    EMPGlobal.showAlert(mesContainer, '', 'danger', message, '', '', '', 'warning', jqXHR.status);
                },
            });
            return false;
        }
    });
};
相关问题