【问题标题】:Codeiginter - do_upload "File not selected"Codeigniter - do_upload“未选择文件”
【发布时间】:2017-07-11 10:59:08
【问题描述】:

我正在尝试从 WYSIWYG 文本区域 (TinyMCE) 上传图像,但它不起作用,它给我错误“未选择文件”。

我使用的是多部分表单,它是否与其他“输入文件”冲突?

谢谢。

这是我正在使用的代码。

查看 (.twig)

{{ form_open_multipart() }}
...
   <div class="form-group">
     <label class="col-sm-2 control-label">Texto</label>
     <div class="col-sm-10">
        {{ form_textarea('text',set_value('text') ? set_value('text') : post.text|raw,'class="form-control editor"') }}
        <input name="image" type="file" id="upload_img_wysiwyg" class="hidden" onchange="">
      </div>
   </div> 
{{ form_close() }}

控制器

public function upload_image_tinymce() {
   //Check whether user upload picture
   if (!empty($_FILES['image']['name'])) {
      $config['upload_path'] = ADDONPATH.'themes/escolamagica/img/escolamagica-blog/';
      $config['allowed_types'] = 'jpg|jpeg|png|gif';
      $config['file_name'] = $_FILES['image']['name'];
      $config['overwrite'] = TRUE;
      $config['max_size'] = '10240';
      $config['max_width'] = '10000';
      $config['max_height'] = '10000';

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

      if ($this->upload->do_upload('image')) {
         $picture = str_replace('\\', '/', base_url().'img/escolamagica-blog/'.$_FILES['image']['name']);
      } else {
        echo 'CONFIG';
        var_dump($config);

        echo 'IMAGE';
        var_dump($_FILES);

        echo 'ERROR';
        $error = array('error' => $this->upload->display_errors());
        var_dump($error);
        die;

        $picture = '';
      }
   } else {
      $picture = '';
   }

   return $picture;
}

Javascript

function initImageUpload(editor) {
    // create input and insert in the DOM
    var inp = $('<input id="tinymce-uploader" type="file" name="pic" accept="image/*" style="display:none">');
    $(editor.getElement()).parent().append(inp);

    // add the image upload button to the editor toolbar
    editor.addButton('imageupload', {
        text: '',
        icon: 'image',
        onclick: function(e) { // when toolbar button is clicked, open file select modal
        inp.trigger('click');
        }
    });

    // when a file is selected, upload it to the server
    inp.on("change", function(e){
        uploadFile($(this), editor);
    });
}

function uploadFile(inp, editor) {
    var input = inp.get(0);
    var data = new FormData();
    data.append('image[file]', input.files[0]);

    $.ajax({
        url: BASE_URL + 'admin/blog/upload_image_tinymce',
        type: 'POST',
        data: data,
        processData: false, // Don't process the files
        contentType: false, // Set content type to false as jQuery will tell the server its a query string request
        success: function(data, textStatus, jqXHR) {
            console.log(data);
            editor.insertContent('<img class="content-img" src="' + data.url + '"/>');
        },
        error: function(jqXHR, textStatus, errorThrown) {
            if(jqXHR.responseText) {
                errors = JSON.parse(jqXHR.responseText).errors
                alert('Error uploading image: ' + errors.join(", ") + '. Make sure the file is an image and has extension jpg/jpeg/png.');
            }
        }
    });
}
tinymce.init({
    language: "pt_PT",
    language_url: BASE_URL + "/admin/js/pt_PT.js",
    selector: ".editor",
    height: 600,
    plugins: [
        "advlist autolink lists link image charmap print preview hr anchor pagebreak",
        "searchreplace wordcount visualblocks visualchars code fullscreen",
        "insertdatetime media nonbreaking save table contextmenu directionality",
        "emoticons template paste textcolor colorpicker textpattern"
    ],
    toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link imageupload",
    toolbar2: "print preview media | forecolor backcolor emoticons",
    image_advtab: !0,

    setup: function(editor) {
        initImageUpload(editor);
    }

【问题讨论】:

    标签: codeigniter tinymce image-uploading


    【解决方案1】:

    您正在为表单中的上传和 tinyMce 图像上传使用不同的索引。您的 html 表单具有名称为“图像”的文件输入。但是您的 MCE ajax 文件上传的名称为“pic”。因此,在您的控制器功能中,upload_image_tinymce()$_FILES['image'] 替换为 $_FILES['pic']

    在控制器中使用它:

    public function upload_image_tinymce() {
       //Check whether user upload picture
       if (!empty($_FILES['pic']['name'])) {
          $config['upload_path'] = ADDONPATH.'themes/escolamagica/img/escolamagica-blog/';
          $config['allowed_types'] = 'jpg|jpeg|png|gif';
          $config['file_name'] = $_FILES['pic']['name'];
          $config['overwrite'] = TRUE;
          $config['max_size'] = '10240';
          $config['max_width'] = '10000';
          $config['max_height'] = '10000';
    
          $this->load->library('upload', $config);
          $this->upload->initialize($config);
    
          if ($this->upload->do_upload('pic')) {
             $picture = str_replace('\\', '/', base_url().'img/escolamagica-blog/'.$_FILES['pic']['name']);
          } else {
            echo 'CONFIG';
            var_dump($config);
    
            echo 'IMAGE';
            var_dump($_FILES);
    
            echo 'ERROR';
            $error = array('error' => $this->upload->display_errors());
            var_dump($error);
            die;
    
            $picture = '';
          }
       } else {
          $picture = '';
       }
    
       return $picture;
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2018-01-25
      • 2018-01-13
      • 2014-12-22
      • 1970-01-01
      • 1970-01-01
      • 2022-08-08
      • 1970-01-01
      • 2019-12-09
      相关资源
      最近更新 更多