2017-07-11 51 views
0

我想從一個所見即所得的文本區(TinyMCE)上傳圖像,但它不工作,它給我錯誤「文件未選中」。Codeiginter - do_upload「文件未選中」

我使用多部分形式,它是否與其他「輸入文件」衝突?

謝謝。

這是我使用的代碼。

視圖(.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); 
    } 

回答

0

您正在使用您的形式上傳和TinyMCE的圖片上傳不同的索引。您的html表單具有名稱爲「image」的文件輸入。但是你的MCE ajax文件上傳的名稱是「pic」。所以,在你的控制器功能upload_image_tinymce()在控制器$_FILES['pic']

使用此替代$_FILES['image']

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; 
}