【问题标题】:Codeigniter - Not able to upload files from multiple file inputsCodeigniter - 无法从多个文件输入上传文件
【发布时间】:2019-07-23 04:15:17
【问题描述】:

我有一个多步骤表单,它有许多输入字段,包括多个文件输入,其中一些是使用 JavaScript 动态生成的。在表单的一个部分中,用户可以上传多个文件。我能够将表单数据插入数据库,但无法上传用户上传的多个文档文件。我正在使用 AJAX 上传表单数据和文件。这是我的控制器代码,

<?php

defined('BASEPATH') or exit('No direct script access allowed');

class Employee extends MY_Controller
{

    public function index()
    {
        $data['title'] = 'employees';
        $this->view('employees/view_employee_view', $data);
    }

    public function save()
    {
        $req = $this->input->post();

            // Some other code here

            // First upload the profile picture
            if (!empty($_FILES['emp_photo']) AND $_FILES["emp_photo"]["error"] == 0) {

                // Upload employee photo
                $emp_photo_data = $this->upload_file(EMP_PHOTOS_FOLDER, 'emp_photo');

                if (array_key_exists('error', $emp_photo_data)) {
                    $this->response(['success'=>false, 'msg' => '<b>File upload failed!Try again</b>', 'data'=> ''], 500);
                    exit();
                }
                else {
                    $employee['emp_photo'] = $emp_photo_data['file_name'];
                }
            }
            
            $this->db->trans_start();

            $emp_id = $this->Employee_model->save($employee);

            // Save edu details of employee
            $this->add_edu_details($emp_id);

            // Upload employee documents
            $doc_details = $this->upload_emp_docs($emp_id); //<-- Here is the problem
            
            if (is_string($doc_details)) {
                // it's an error
                $this->response(['success' => false, 'msg' => '<b>Employee documents upload failed!</b>', 'data' => $doc_details]);
                $this->db->trans_rollback(); 
                exit();
            }
            else{
                if ($doc_details === FALSE) {
                    // Error occured - rollback
                    $this->response(['success' => false, 'msg' => '<b>Employee documents upload failed!</b>', 'data' => '']);
                    $this->db->trans_rollback();
                    exit();
                }
            }

    }


    private function upload_emp_docs($emp_id)
    {
        $counts = $this->input->post('emp_docs_count');

        $req = $this->input->post();
        
        $data = [];
        for ($i = 1; $i <= $counts; $i++) { 
            
            if (!empty($_FILES['emp_doc_' . $i])) {
                $res = $this->upload_file(EMP_DOCS_FOLDER, 'emp_doc_' . $i, 'pdf');
                $done = move_uploaded_file($_FILES["emp_doc_" . $i]["tmp_name"], EMP_PHOTOS_FOLDER . md5(time()) . '.jpg');
                if (array_key_exists('error', $res)) {
                    return $res['error']; // return error string
                }
                else {
                    $data[$i] = ["emp_id" => $emp_id, 'file_name' => $res["file_name"], 'doc_type'=> $req["emp_doc_type_{$i}"] ];
                }
            }
        }

        if (!empty($data)) {
            $done = $this->Emp_doc_model->save($data);
            return !empty($done) ? TRUE : FALSE;
        }
        else {
            return FALSE;
        }
    }

}

这是 MY_Controller.php 中实际执行上传任务的代码

public function upload_file($dir, $input, $allowed_types = 'jpeg|jpg|png')
    {
        $config['upload_path']   = $dir;
        $config['allowed_types'] = !empty($allowed_types) ? $allowed_types : 'jpeg|jpg|png';
        $config['max_size']      = 0;
        $config['max_width']     = 0;
        $config['max_height']    = 0;
        $config['file_name']     = md5(time() . rand(1, 1000));

        $this->load->library('upload', $config);

        if (!$this->upload->do_upload($input)) {
            return array('error' => $this->upload->display_errors());
        } else {
            $data = $this->upload->data();

            // If it is image then resize it to reduce the image file size
            if ($data['is_image']) {
                $this->resize_image($data['full_path']);
            }

            return $data;
        }
    }

在一个部分中,用户可以选择个人资料图片,并且我可以使用上述代码上传该文件,但是当我尝试上传多个文件时,我无法找到它不起作用的原因。

这是该部分的 HTML 代码

<div class="col upload-area">
<div class="input-group">
   <a class="btn bg-grey btn-block" id="add-file-group">ADD FILE</a>
</div>
<input type="hidden" id="emp_docs_count" name="emp_docs_count" value="1">
<div class="row clearfix file-upload-group">
   <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">
      <div class="form-group">
         <div class="form-line">
            <input name="emp_doc_1" type="file" class="form-control">
         </div>
      </div>
   </div>
   <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">
      <div class="form-group">
         <div class="form-line">
            <select name="emp_doc_type_1" id="emp_doc_type_1" class="form-control show-tick selectpicker" title="Choose one of the following...">
               <option value="<?= OFFER_LETTER ?>"><?= OFFER_LETTER ?></option>
               <option value="<?= APPOINT_LETTER ?>"><?= APPOINT_LETTER ?></option>
               <option value="<?= CONF_LETTER ?>"><?= CONF_LETTER ?></option>
               <option value="<?= APP_LETTER_1 ?>"><?= APP_LETTER_1 ?></option>
               <option value="<?= APP_LETTER_2 ?>"><?= APP_LETTER_2 ?></option>
               <option value="<?= REL_LETTER ?>"><?= REL_LETTER ?></option>
               <option value="<?= EXP_TER_LETTER ?>"><?= EXP_TER_LETTER ?></option>
            </select>
         </div>
      </div>
   </div>
   <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
      <!-- <button type="button" class="btn btn-primary btn-sm  waves-effect"><i class="material-icons">cloud_upload</i></button> -->
      <button type="button" class="btn btn-danger btn-sm  waves-effect remove-me"><i class="material-icons">delete_forever</i></button>
   </div>
</div>

这是动态生成输入标签的JS代码

$("#add-file-group").click(function() {
    // Dynamically generate the id for upload-group elements
    const count = $(".upload-area").find(".file-upload-group").length + 1;

    const newID = "upload-area-id-" + count;

    const fileUploadGroup = `<div class="row clearfix file-upload-group">
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">
        <div class="form-group">
            <div class="form-line">
                <input type="file" class="form-control" id="file_${count}" name="emp_doc_${count}">
            </div>
        </div>
    </div>
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">
        <div class="form-group">
            <div class="form-line">
            <select name="emp_doc_type_${count}" id="emp_doc_type_${count}" data-size="2" class="form-control show-tick selectpicker" title="Choose one of the following..." tabindex="-98"><option class="bs-title-option" value="">Choose one of the following...</option>
                <option value="OFFER LETTER">OFFER LETTER</option>
                <option value="APPOINTEMENT LETTER">APPOINTEMENT LETTER</option>
                <option value="CONFIRMATION LETTER">CONFIRMATION LETTER</option>
                <option value="APPRAISAL LETTER 1">APPRAISAL LETTER 1</option>
                <option value="APPRAISAL LETTER 2">APPRAISAL LETTER 2</option>
                <option value="RELIVING LETTER">RELIVING LETTER</option>
                <option value="EXPERIENCE / TERMINATION LETTER">EXPERIENCE / TERMINATION LETTER</option>
            </select>
            </div>
        </div>
    </div>
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
        <button type="button" class="btn btn-primary btn-sm  waves-effect"><i class="material-icons">cloud_upload</i></button>
        <button type="button" class="btn btn-danger btn-sm  waves-effect remove-me"><i class="material-icons">delete_forever</i></button>
        
    </div>
</div>`;

    $(".upload-area").append(fileUploadGroup);

    // Increment the doc counter of hidden field
    $('#emp_docs_count').val(count);

    // Refresh the selectpicker to work on this generated element
    $(".selectpicker").selectpicker("refresh");
});
                                    

【问题讨论】:

  • 在此处发送您的 html
  • 签入 autoload.php $autoload['libraries'] = array(''upload');存在与否 $autoload['helper'] = array('file');
  • 不需要,我确定它存在,因为我可以从一个文件输入上传图像文件。
  • 好的,兄弟,那就好了
  • &lt;input name="emp_doc_1" type="file" class="form-control"&gt; 更改为 &lt;input name="emp_doc_1" type="file" class="form-control" multiple&gt; 然后 $_FILES 返回多个图像,您必须运行 foreach 并为多个文件执行此操作,无论您对单个图像做什么stackoverflow.com/questions/32864056/…

标签: php codeigniter-3 ajaxform


【解决方案1】:

确保您的表单输入具有属性enctypemultipart/form-data 并且您作为文件的输入具有名称name[](要创建选定的每个文件都在一个数组上)并具有属性multiple

【讨论】:

  • 正确阅读我的问题,我正在使用 form_open_multipart 创建表单。
  • @RopAliMunshi 和文件名应如下所示。
【解决方案2】:

我终于解决了,我每次调用upload_file()方法时只需要初始化上传库,我刚刚添加了一行就开始工作了,

public function upload_file($dir, $input, $allowed_types = 'jpeg|jpg|png')
    {
        $config['upload_path']   = $dir;
        $config['allowed_types'] = !empty($allowed_types) ? $allowed_types : 'jpeg|jpg|png';
        $config['max_size']      = 0;
        $config['max_width']     = 0;
        $config['max_height']    = 0;
        $config['file_name']     = md5(time() . rand(1, 1000));

        $this->load->library('upload');

        $this->upload->initialize($config); //<-- this line solved it

        if (!$this->upload->do_upload($input)) {
            return array('error' => $this->upload->display_errors());
        } else {
            $data = $this->upload->data();

            // If it is image then resize it to reduce the image file size
            if ($data['is_image']) {
                $this->resize_image($data['full_path']);
            }

            return $data;
        }
    }

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-09-26
    • 2019-10-28
    • 1970-01-01
    • 2012-04-08
    • 2012-09-18
    • 1970-01-01
    • 1970-01-01
    • 2019-05-18
    相关资源
    最近更新 更多