ci ajax 上传图片,php – Codeigniter Ajax Upload image – Stack Overflow

  • Post author:
  • Post category:php


Thanks for you help, I change my dynamic about the script so now, it works perfectly with what I have to do.

There is the script for my upload system :

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(”, ”);

}

}

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

}

}

First of all include :

-jQuery

-browserPlus

-Plupload

Now add this script in an empty file:

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

});

Do your own customization and that’s it, no need extra script like you can see on website like copy/paste all script from a php file to a controller, just add ‘file’ inside do_upload and everything’s gonna work fine !

Have a nice day guys, hope it’s help.

Simon