Codeigniter Ajax上传图片

我目前正在使用CodeIgniter为我的学校项目开发一些表单。

我的想法是我有一个带图像上传的表单。 我正在尝试使用Ajax动态地执行它，但它似乎根本不起作用。 我尝试使用php的非动态版本，它完美运行，我的图像在我的文件夹中，我没有问题。

我尝试了5或6个插件没有结果，这肯定是我的错，但我不知道我在哪里犯了错误。

if($result = $this->images_model->add_bdd()) { $data['uploaded'] = $result; $data['message_upload'] = 'Image uploader avec succès.'; $this->template->set_title('Upload successful'); $this->template->view('add_places',$data); } else { $this->template->set_title('Upload failed'); $this->template->view('add_places'); } 

 function add_bdd() { $config = array( 'allowed_types' => 'jpg|jpeg|tiff', 'upload_path' => $this->gallery_path, 'max_size' => 2000, 'remove_spaces' => TRUE, 'overwrite' => FALSE ); $this->load->library('upload',$config); if ($this->upload->do_upload()) { $data_img = $this->upload->data(); $exif = $this->exif_extractor->coords($data_img['full_path']); $data = array( 'titre' => 'titlecontent', 'url' => base_url('images/'.$data_img['file_name']), 'url_min' => base_url('images/'.$data_img['raw_name'].'_min'.$data_img['file_ext']), 'alt' => 'cover_contentName', 'id_users' => $this->session->userdata('id'), 'date_upload' => date('Ymd H:m'), 'date_modified' => date('Ymd H:m'), 'lat' => $exif[0], 'long' => $exif[1], ); $this->db->insert('pictures',$data); return $exif; } else { return false; } } 

 
  Upload   

任何人都可以给我一个jQuery插件来动态上传图像，并将我想要返回的路径和其他数据发送回脚本我的图像？

我不能像我为jQuery所做的所有代码一样粘贴，但我真的需要帮助。 我已经2天了！

谢谢你的帮助。

Answer 1

add_bdd（）函数是否返回false？

我已经使用CodeIgnitor来做这件事，我发现你指定的filter通常是你没有上传文件的原因。 您应该在if ($this->upload->do_upload())为false的部分添加更多代码，并使用以下命令打印出调试代码：

 echo $this->upload->display_errors(); 

有关详细信息，请参阅此处： http ： //codeigniter.com/user_guide/libraries/file_uploading.html

请记住，如果您通过AJAX调用此方法，则需要一种方法来查看调试结果，例如将echo’ed调试结果打印到调用页面上的HTML元素。 您还可以使用Firebug之类的工具打印iformation。

Answer 2

没有Javascript代码，任何人都无法为您做到。

查看关于Nettuts +的本教程，深入了解您所需的基本知识，以便您更好地理解，调试和调整代码。

此外，我几乎不使用jQuery插件，因为我发现更容易编写一个更适合我当前项目的需求，所以我不推荐任何。

Answer 3

谢谢你的帮助，我改变了我对脚本的动态，所以现在，它完全适用于我必须做的事情。

我的上传系统有脚本：

< - VIEW（upload_img） - >

 
 
 [Select files]  [Upload files] 

< - CONTROLLER - >

 function index(){ if($this->_access()) { $this->template->add_include('js/jquery.js') ->add_include('js/browserplus.js') ->add_include('js/plugins/plupload/plupload.full.js') ->add_include('js/imgfunc.js'); $this->template->view('upload_img'); } else { redirect(site_url()); } } function upload_image_spot() { if($query = $this->images_model->upload_image_spot()) { echo json_encode($query); } else { echo $this->upload->display_errors('', ''); } } 

< - MODEL - >

  function upload_image_spot() { $config['upload_path'] = realpath(APPPATH. '../images/spots'); $config['allowed_types'] = 'jpg|jpeg|tiff|png'; $config['max_size'] = 3062; $config['encrypt_name'] = TRUE; $this->load->library('upload', $config); if($this->upload->do_upload('file')) // file means the file send to the website for upload, this is the name of field for Plupload script { $data_img = $this->upload->data(); $copies = array( array('dir' => 'images/spots/large/', 'x' => 1000, 'y' => 600), array('dir' => 'images/spots/thumb/', 'x' => 100, 'y' => 60) ); $this->copies($data_img,$copies); return 'whatever'; // Not real data, I don't wanna post them here } } 

< - JS-SCRIPTS - >

首先包括：

-jQuery

-browserPlus

-Plupload

（ Plupload脚本 ）

现在将此脚本添加到空文件中：

 var uploader = new plupload.Uploader({ runtimes : 'gears,html5,flash,silverlight,browserplus', browse_button : 'userfile', container : 'container', max_file_size : '3mb', url : 'yourUploadFunctionCI', flash_swf_url : 'plugins/plupload/js/plupload.flash.swf', silverlight_xap_url : 'plugins/plupload/js/plupload.silverlight.xap', filters : [ {title : "Image files", extensions : "jpg,jpeg,JPG,JPEG,tiff,png"}, ] }); uploader.bind('Init', function(up, params) { }); $('#uploadfiles').click(function(e) { uploader.start(); e.preventDefault(); }); uploader.init(); uploader.bind('FilesAdded', function(up, files) { $.each(files, function(i, file) { $('#filelist').html(""); $('#filelist').append( '
' + file.name + ' (' + plupload.formatSize(file.size) + ') ' + '
'); }); up.refresh(); }); uploader.bind('UploadProgress', function(up, file) { $('#' + file.id + " b").html(file.percent + "%"); }); uploader.bind('Error', function(up, err, msg,file) { $('#filelist').append("
Error: " + err.code + ", Message: " + err.message + (err.file ? ", File: " + err.file.name : "") + "
" ); console.log(msg,up,err); up.refresh(); }); uploader.bind('FileUploaded', function(up, file,response) { $('#' + file.id + " b").html("100%"); var data = jQuery.parseJSON(msg.response); console.log(data); }); 

做你自己的定制，就是这样，不需要你可以在网站上看到的额外脚本，比如将所有脚本从php文件复制/粘贴到控制器，只需在do_upload中添加’file’，一切都会正常工作！

祝大家好运，希望对大家有所帮助。

西蒙