输入类型=“文件”在使用jquery验证引擎插件时不发送文件

时间:2014-05-29 17:37:13

标签: jquery validation plugins

我正在使用jQuery-Validation-Engine Plugin验证我的html表单。所有验证都很有效,但是当我尝试使用input type =“file”发送文件(图像)时,我遇到了一个问题。在我的表单中,我有许多文本字段,选择和两个输入字段用于文件选择和电子邮件发送。没有验证插件,所有工作都很好 - 来自其他字段的文件和数据将被发送到电子邮件。但是当我使用插件时,只发送来自textfield和choose的数据。

这是我的文件附件的PHP代码处理程序

// PHOTO ATTACHMENT

$mime_boundary="==Multipart_Boundary_x".md5(mt_rand())."x";

    $headers = "From: $fromEmail\r\n" .
    "MIME-Version: 1.0\r\n" .
       "Content-Type: multipart/mixed;\r\n" .
       " boundary=\"{$mime_boundary}\"";

    $message = "This is a multi-part message in MIME format.\n\n" .
       "--{$mime_boundary}\n" .
       "Content-Type: text/html; charset=\"iso-8859-1\"\n" .
       "Content-Transfer-Encoding: 7bit\n\n" .
    $message . "\n\n";

    foreach($_FILES as $userfile)
    {
       $tmp_name = $userfile['tmp_name'];
       $type = $userfile['type'];
       $name = $userfile['name'];
       $size = $userfile['size'];

       if (file_exists($tmp_name))
       {
          if(is_uploaded_file($tmp_name))
          {
             $file = fopen($tmp_name,'rb');

             $data = fread($file,filesize($tmp_name));

             fclose($file);


             $data = chunk_split(base64_encode($data));
          }

          $message .= "--{$mime_boundary}\n" .
             "Content-Type: {$type};\n" .
             " name=\"{$name}\"\n" .
             "Content-Disposition: attachment;\n" .
             " filename=\"{$fileatt_name}\"\n" .
             "Content-Transfer-Encoding: base64\n\n" .
          $data . "\n\n";
       }
    }

    $message.="--{$mime_boundary}--\n";

这是jQuery-Validation-Engine Plugin初始化

的JavaScript代码
    function initContactForm() {
    // Hide status on contact page
    $('#success, #error').css('display', 'none');

    // Submitting contact form
    if ($('form#contact-form').length > 0) {

        var contactForm = $('form#contact-form');
        contactForm.submit(function() {

            $('#success').css('display', 'none');
            $('#error').css('display', 'none');

            if (contactForm.validationEngine('validate')) {

                $submitButton = $(this).find('input[type="submit"]');
                $submitButton.removeClass().addClass('flat button fullwidth disabled');
                $submitButton.attr('value', 'Submitting...');
                $submitButton.attr('disabled', 'disabled');

                $.ajax({
                    type : 'POST',
                    url : 'emailSend.php',
                    data : contactForm.serialize(),
                    success : function(result) {

                        if (result == 'true') {
                            contactForm.stop().animate({
                                opacity : '1'
                            }, 400, function() {

                                $submitButton = $(this).find('input[type="submit"]');
                                $submitButton.removeClass().addClass('flat button fullwidth disabled');
                                $submitButton.attr('value', 'Submitted');
                                $submitButton.attr('disabled', 'disabled');

                                contactForm.css('display', 'block');
                                $('#success').css('display', 'block');
                                $('#success').stop().animate({
                                    opacity : '1'
                                }, 900);
                            });

                        } else {
                            $('#error').css('display', 'block');
                            $('#error').stop().animate({
                                opacity : '1'
                            }, 1000);

                            alert('Error Message: ' + result);
                        }

                    },
                    error : function(xmlHttpRequest, textStatus, errorThrown) {
                        $('#error').css('display', 'block');
                        $('#error').stop().animate({
                            opacity : '1'
                        }, 1000);

                        alert(errorThrown);
                    }
                });
                return false;
            }
        });

    }
}

1 个答案:

答案 0 :(得分:0)

在搜索谷歌一天后,我找到了我的解决方案。问题是我们可以在 .ajax()中使用 .serialize()来收集文件数据。而不是我使用新FormData(this)。这是我的ajax工作代码

$.ajax({
type : 'POST',
url : 'emailSend.php',
data : new FormData(this),
processData: false,
contentType: false,
success : function(result) {
...
}

这是一篇帮助我的文章 http://portfolio.planetjon.ca/2014/01/26/submit-file-input-via-ajax-jquery-easy-way/