Javascript 使用AJAX和Codeigniter进行多文件上传

大家好，我正在尝试使用ajax和codeigniter上传多个图像。我不熟悉ajax和jquery，所以请帮助我了解我做错了什么或没有做什么

这是我的控制器代码和上传功能：

    private function setup_upload_option()
{
    $config = array();
    $config['upload_path'] = './data/images/gallery_images';
    $config['allowed_types'] = 'jpg|png|gif';
    $config['encrypt_name'] = TRUE;
    $config['overwrite'] = FALSE;
    return $config;
}

function upload()
{
    $this->check_is_validated();
    $data['error'] = array('error' => '');
    $files = $_FILES;

    $id = $this->input->post('galleryID');

    if ($_POST) {

        $count = count($_FILES['userfile']['name']);
        for ($i = 0; $i < $count; $i++) {
            $_FILES['userfile']['name'] = $files['userfile']['name'][$i];
            $_FILES['userfile']['type'] = $files['userfile']['type'][$i];
            $_FILES['userfile']['tmp_name'] = $files['userfile']['tmp_name'][$i];
            $_FILES['userfile']['size'] = $files['userfile']['size'][$i];
            $_FILES['userfile']['error'] = $files['userfile']['error'][$i];

            $this->upload->initialize($this->setup_upload_option());
            if ($this->upload->do_upload() == FALSE) {
                $data['error'] = $this->upload->display_errors();
                $data['title'] = 'Create a New Property';
                $data['content'] = 'admin' . '/gallery';
                $this->load->view('templates/dashboard/template', $data);
            } else {
                $upload_data = $this->upload->data();
                $data = array(
                    'gallery_id' => $id,
                    'image_name' => $upload_data['file_name'],
                    'image_size' => $upload_data['file_size'],
                    'image_ext' => $upload_data['file_ext'],
                    'full_path' => $upload_data['file_path']
                );
                $this->db->insert('gallery_images', $data);
            }
        }
    }
}

private function setup\u upload\u option（）
{
$config=array（）；
$config['upload_path']='./data/images/gallery_images'；
$config['allowed_types']='jpg | png | gif'；
$config['encrypt_name']=TRUE；
$config['overwrite']=FALSE；
返回$config；
}
函数上传（）
{
$this->check_is_validated（）；
$data['error']=array（'error'=>''）；
$files=$\u文件；
$id=$this->input->post（'galleryID'）；
如果（美元邮政）{
$count=count（$_文件['userfile']['name']）；
对于（$i=0；$i<$count；$i++）{
$\u FILES['userfile']['name']=$FILES['userfile']['name'][$i]；
$\u FILES['userfile']['type']=$FILES['userfile']['type'][$i]；
$\u FILES['userfile']['tmp_name']=$FILES['userfile']['tmp_name'][$i]；
$\u FILES['userfile']['size']=$FILES['userfile']['size'][$i]；
$\u FILES['userfile']['error']=$FILES['userfile']['error'][$i]；
$this->upload->initialize（$this->setup_upload_option（））；
如果（$this->upload->do_upload（）==FALSE）{
$data['error']=$this->upload->display_errors（）；
$data['title']='createanewproperty'；
$data['content']='admin'./gallery'；
$this->load->view（'templates/dashboard/template'，$data）；
}否则{
$upload_data=$this->upload->data（）；
$data=数组(
“画廊id”=>$id，
'image\u name'=>$upload\u data['file\u name']，
'image\u size'=>$upload\u data['file\u size']，
'image_ext'=>$upload_data['file_ext']，
“完整路径”=>$upload_数据[“文件路径”]
);
$this->db->insert（'gallery\u images'，$data）；
}
}
}
}

下面是我使用ajax和jquery的视图文件：

<div class="modal fade" role="dialog" id="modalUpload">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <?php echo form_open_multipart('gallery/upload', array('id' => 'galleryImages')) ?>
                <div class="form-group">
                    <label for="gallery">Please select which gallery to upload to:</label>
                    <select class="form-control" name="galleryID">
                        <option value="0"></option>
                        <?php foreach ($gallery as $item) { ?>
                            <option value="<?= $item['ID'] ?>"><?= $item['gallery_name']; ?></option>
                        <?php } ?>
                    </select>
                </div>
                <div class="form-group">
                    <label for="images">Please select some images for upload!</label>
                    <input type="file" name="file[]" class="form-control" id="file" multiple/>
                </div>
                <?php echo form_close(); ?>
            </div>
            <script>
                function doUpload() {

                    var form_data = {
                        $('#galleryID').val();
                }

                    $.ajax({
                        url: '<?php echo base_url(). 'gallery/upload'?>',
                        type: 'POST',
                        data: form_data,
                        success: function (data) {
                            $('#modalUpload').modal('hide'); // hide the modal
                            $('#galleryImages')[0].reset(); // reset form on modals
                            $('#galimg').load('<?=base_url();?>' + "#galimg"); // reload the view
                        });
                }
                }
            </script>
            <div class="modal-footer">
                <button type="button" style="margin-left: 10px;" class="btn btn-success pull-right"
                        onclick="doUpload()"><i class="fa fa-upload"></i> Upload Images
                </button>
                <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-times">&nbsp;</i>Close
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

请选择要上载到的库：
请选择一些图片进行上传！
函数doUpload（）{
变量形式_数据={
$（'#galleryID'）.val（）；
}
$.ajax({
url:“”，
键入：“POST”，
数据：表格数据，
成功：功能（数据）{
$（'#modalUpload'）.modal（'hide'）；//隐藏模态
$（'#galleryImages'）[0].reset（）；//重置模态上的表单
$（'#galimg'）。加载（'+'#galimg'）；//重新加载视图
});
}
}
上传图像
接近

---

我的问题是如何通过jquery将所选文件传递给控制器以上传到数据库中？

您好，您可以使用dropzone在视图中上传多个图像集dropzone非常容易，其javascript代码如下所示

var myDropzone = new Dropzone({
                        url: "URL",
                        paramName: "Image",
                        uploadMultiple: true,

                        parallelUploads: 1,
                        addRemoveLinks: true,
                        autoDiscover: false,
                        dataType: "json",
                        removedfile: function (file) {

                        },
                        init: function () {

                        },
                    });

在您的控制器中，您可以获得图像阵列和简单使用的图像上传功能

---

谢谢您的回答我该如何设置它，使其与上面发布的控制器代码配合使用？在控制器中，您可以使用图像上载库，如果您使用图像上载库，则可以使用简单的图像上载php函数，这样您的代码看起来像$this->load->library（'imageUpload/upload'，$_FILES['vImage'，'en_GB'））; $handleImage=new Upload（$_FILES['vImage']），请使用我当前的代码，并向我展示如何设置控制器、模型和视图的示例？