Krajee文件输入仅上传最后选择的图像

时间:2015-01-04 17:13:41

标签: javascript php jquery forms file-upload

我尝试整合来自http://plugins.krajee.com/file-input/demo的文件输入插件。

这是我的简单形式:

<form action="process.php" method="post" enctype="multipart/form-data">
<input id="krajee" type="file" name="file[]" multiple="true">
<input type="submit" name="submit" id="submit">
</form>

这允许我浏览并选择多个文件。当我提交表单时,它会将所有文件上传到我的服务器。 但是当我浏览选择文件1然后我浏览以选择另一个文件(文件2)。它还显示2个文件预览但是当我提交表单时,它只上传最后一个选择文件。请帮忙......谢谢

这是我的process.php文件:

<?php
if(isset($_POST["submit"])){
require("../configs/dbconnect.php");
/*Form variable   */
$owner = mysql_real_escape_string($_POST["owner"]);
$title = mysql_real_escape_string($_POST["title"]);
$description = mysql_real_escape_string($_POST["description"]);
$city = mysql_real_escape_string($_POST["city"]);
$brand = mysql_real_escape_string($_POST["brand"]);
$marketprice = mysql_real_escape_string($_POST["marketprice"]);
$price = mysql_real_escape_string($_POST["price"]);
$phone = mysql_real_escape_string($_POST["phone"]);
/*** the upload directory ***/
$upload_dir= 'uploads';

/*** numver of files to upload ***/
$num_uploads = 5;

/*** maximum filesize allowed in bytes ***/
$max_file_size  = 5000000;

/*** the maximum filesize from php.ini ***/
$ini_max = str_replace('M', '', ini_get('upload_max_filesize'));
$upload_max = $ini_max * 1024;

/*** a message for users ***/
$msg = 'Please select files for uploading';

/*** an array to hold messages ***/
$messages = array();

/*** check if a file has been submitted ***/
if(isset($_FILES['file']['tmp_name']))
{
    /** loop through the array of files ***/
    for($i=0; $i < count($_FILES['file']['tmp_name']);$i++)
    {
        // check if there is a file in the array
        if(!is_uploaded_file($_FILES['file']['tmp_name'][$i]))
        {
            $messages[] = 'No file uploaded';
        }
        /*** check if the file is less then the max php.ini size ***/
        //elseif($_FILES['image']['size'][$i] > $upload_max)
        //{
        //    $messages[] = "File size exceeds $upload_max php.ini limit";
        //}
        // check the file is less than the maximum file size
        elseif($_FILES['file']['size'][$i] > $max_file_size)
        {
            $messages[] = "File size exceeds $max_file_size limit";
        }
        else
        {
            //$temp = explode(".", $_FILES["file"]["name"][$i]);
            //$extension = end($temp);
            //$name[$i] = sha1(microtime()) . "." . $extension;
            $name[$i]=$_FILES["file"]["name"][$i];
            // copy the file to the specified dir 
            if(move_uploaded_file($_FILES['file']['tmp_name'][$i],$upload_dir.'/'.$name[$i]))
            {
                /*** give praise and thanks to the php gods ***/
                $messages[] = $name[$i].' uploaded';
                $image_path[$i]=$upload_dir.'/'.$name[$i];
            }
            else
            {
                /*** an error message ***/
                $messages[] = 'Uploading '.$name[$i].' Failed';
            }
        }
    }
}
$image_path_string=serialize($image_path);
$sql = "INSERT INTO memberpost(owner, title, description, city, brand, marketprice, price, phone, image) VALUES ('$owner', '$title','$description','$city','$brand','$marketprice','$price','$phone', '" . $image_path_string . "')";
$result = mysql_query($sql) or die ("Could not insert data into DB: " . mysql_error());
 if(sizeof($messages) != 0)
{
    foreach($messages as $err)
    {
        echo $err.'<br />';
    }
}
}
?>

这是配置文件:

<script>
$("#krajee").fileinput({
dropZoneEnabled: false,
uploadAsync: false,
maxFileSize: 2000,
allowedFileExtensions: ["jpg", "gif", "png"],
allowedFileTypes: ["image"],
allowedPreviewTypes: ["image"],
previewSettings: {
image: {width: "240px", height: "auto"},
other: {width: "240px", height: "auto"},
},
showRemove: false,
showUpload: false,
maxFileCount: 10,
uploadUrl: "html/member-post-final.html",
msgFilesTooMany: "Number of files selected for upload ({n}) exceeds maximum allowed limit of {m}. Please retry your upload!",
msgSizeTooLarge: "File {name} ({size} KB) exceeds maximum allowed upload size of {maxSize} KB. Please retry your upload!",
msgInvalidFileExtension: "Invalid extension for file {name}. Only {extensions} files are supported.",
msgFileNotFound: "File {name} not found!",
msgFilePreviewError: "An error occurred while reading the file {name}.",
msgInvalidFileType: "Invalid type for file {name}. Only {types} files are supported.",
msgInvalidFileExtension: "Invalid extension for file {name}. Only {extensions} files are supported.",
msgValidationError:"<span class='text-danger'><i class='glyphicon glyphicon-exclamation-sign'></i> File Upload Error</span>",
msgSelected: "{n} files selected.",
browseLabel: "Chọn ảnh",
initialCaption: "Chọn tối đa 10 ảnh",
});
</script>

2 个答案:

答案 0 :(得分:0)

你能展示HTML代码吗?您必须使用括号创建输入并设置multi属性,如下所示:

<input type="file" name="example[]" multiple="multiple">

答案 1 :(得分:0)

使用此配置

itemID = 'CC100'