Question

我有一些用户输入的简单表单，现在，我会让用户在表单中上传附件图像。我决定使用blueimp jQuery File Upload来上传图片。

html文件如：

<form name="history" action="/userformlink" method="post" enctype="multipart/form-data">                
    .......some input fileds.......
    <div class="uploadFile">
        <span>
            <i class="glyphicon glyphicon-plus"></i>
            <span>Select files...</span>
            <input id="fileupload" type="file" name="file" accept="image/png,image/jpeg">
        </span>

        <!-- The global progress bar -->
        <div id="progress" class="progress">
            <div class="progress-bar progress-bar-success"></div>
        </div>
        <!-- The container for the uploaded files -->
        <div id="files" class="files"></div>
    </div>
    <input type="submit" value="OK" name="submitUserInput" onclick="$('#hidenInputFiled').val(1); return true;"/>
</form>
<script type="text/javascript">
    $(function () {
        'use strict';    
        var filesList = new Array();        
        $('#fileupload').fileupload({
            dataType: 'json',
            maxNumberOfFiles: 1
            }).on('fileuploadadd', function (e, data) {
                data.context = $('<div/>').appendTo('#files');
                $.each(data.files, function (index, file) {
                    filesList.push(data.files[index]);
                });
            }).on('fileuploadprogressall', function (e, data) {
                var progress = parseInt(data.loaded / data.total * 100, 10);
                $('#progress .progress-bar').css(
                    'width',
                    progress + '%'
                );
            }).on('fileuploadfail', function (e, data) {
                });
            }).prop('disabled', !$.support.fileInput)
            .parent().addClass($.support.fileInput ? undefined : 'disabled');


        //I think the code below is important (???)
        $("#history").submit(function(event) {
            if (filesList.length > 0) {
                $('#fileupload').fileupload('send', {files: filesList})
            } else {
            }
        });
    });
</script>

我在服务器端使用php来检索用户输入字段，但我不知道如何检索上传的文件（使用UploadHandler类？）

这是我的PHP代码：

public function postProcess()
{
    if (Tools::isSubmit('submitUserInput'))
    {
        $option=array(
        'upload_dir' => '****',
        'upload_url' => '***',
        'accept_file_types' => '/\.(jpe?g|png)$/i'
        );
        $upload_handler = new UploadHandler($option);
    }
    //↑　there is nothing uploded file here !!!
}

我希望在将用户输入字段正确放入数据库之后，在我的php代码中使用UploadHandler来上传文件。

怎么做？

blueimp jQuery文件上传 - 如何上传表单中的文件？

0 个答案: