输入type = file没有使用Jquery Validation Plugin传递给php页面

时间:2014-06-06 07:45:06

标签: javascript php jquery ajax validation

我有一个带文件上传功能的html表单,我想使用jquery插件进行验证。现在,如果文件为空,则显示错误消息,但如果文件是不同的扩展名,则应显示消息"不允许文件类型" 但是它似乎没有传递到文件 filecheck.php 页面,它将验证文件类型。

如何使用此jquery插件验证此文件类型?你能帮帮我吗?谢谢。

Html部分:

<div id="result"></div> <!--error or success message will be show here-->

<form action="editContactDetails.php" method="post" enctype="multipart/form-data" id="all_contact_details">
  <tr>
    <td></td>  
    <td align="left"><input name="file1" type="file" id="file" class="file"/></td>
    <td></td>
  </tr>
</form>

Jquery部分:

$(document).ready(function() {  
    // validate signup form on keyup and submit
    $("#all_contact_details").validate({
    submitHandler: function(form) {
        $.ajax({
            url: form.action,
            type: form.method,
            //async: false,
            data: $(form).serialize(),
            beforeSend : function (){
              $('input[type=submit]').attr('disabled', false); 
            },
            success: function(response) {
            $('#result').html(response);
            //$(form).find('div').hide();
            $(form).hide();

            }            
        });
    },

        rules: {            
            file1: {
                    required: true,                    
                    remote: {
                        url: "filecheck.php",
                        type: "post"
                     }
                },

        },
        messages: {         
            file1: {
                    required: "Upload your file",                    
                    remote: "File is not allowed"
                },          
        }
    });

});

Php part(filecheck.php)

<?php
$file1 =  $_FILES['file1']['name']; 
$allowedExts = array("jpg");    
$temp = stripslashes($file1);
$temp = explode(".", $temp);
$extension = end($temp);    

if(!in_array($extension, $allowedExts))
    echo 'false';
else
    echo 'true';        
?>

2 个答案:

答案 0 :(得分:1)

SubmitHandler 在表单有效时处理实际提交
http://jqueryvalidation.org/validate/#submithandler

因此,这不会验证文件扩展名本身。

然而,你可以使用jqueryvalidation中内置的extension验证器来完成你想要实现的目标。请参阅此链接以供参考和举例:

http://jqueryvalidation.org/extension-method/

答案 1 :(得分:1)

在尝试更难之前,所有浏览器都不支持使用AJAX提交文件。 然而,你可以做一个技巧,实际上是将表单提交给目标iframe,然后使用javascript来读取该iframe的内容并以某种方式显示/使用它们。这样您实际上提交了表单而没有刷新主窗口。

这篇文章完全涵盖了它: Ajax: a simplified version of file upload form using IFRAME