Login

05-25-2012, 01:34 PM

[eluser]bill19[/eluser]
Hi everyone,

I am trying to build an upload page using the blueimp jquery upload plugin

https://github.com/blueimp/jQuery-File-U...odeIgniter

The file upload is working, but the jquery/ajax component is not. I am not experienced with javascript/Jquery, Is there any obvious problems in this code preventing jquery from working?

Thank you,

Bill

Here is the controller:

Code:
&lt;?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Upload extends CI_Controller {

 public function __construct()

 {

  parent::__construct();

  $this->load->helper(array('form', 'url'));

 }

 public function index()

 {

  $this->load->view('form', array('error' => ''));

 }

 public function do_upload()

 {

  $config['upload_path'] = FCPATH.'uploads/';

  $config['allowed_types'] = 'gif|jpg|png|jpeg';

  $config['max_size'] = '36000';

  $config['max_width'] = '10240';

  $config['max_height'] = '76800';

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

  if ( ! $this->upload->do_upload())

  {

   $error = array('error' => $this->upload->display_errors());

   $this->load->view('form', $error);

  }

  else

  {

   $data['upload_data'] = $this->upload->data();

   $this->load->view('success', $data);

  }

 }

}

// End of file upload

Here is the view;

Code:
&lt;html&gt;

 &lt;head&gt;

 &lt;title&gt;Upload Form&lt;/title&gt;

 &lt;link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" id="theme"&gt;

 &lt;link rel="stylesheet" href="http://dl.dropbox.com/u/8626323/dnd/jquery.fileupload-ui.css"&gt;

 &lt;style&gt;

 body {

  font-family: Verdana, Arial, sans-serif;

  font-size: 13px;

  margin: 0;

  padding: 20px;

 }

 &lt;/style&gt;

 &lt;/head&gt;

 &lt;body&gt;

  &lt;?php echo $error;?&gt;

  &lt;?php echo form_open_multipart('upload/do_upload', array('id' => 'file_upload')); ?&gt;

   &lt;input type="file" name="userfile" multiple /&gt;

   <button>Upload</button>

   <div>Upload files</div>

  &lt;?php echo form_close(); ?&gt;

  <table id="files"></table>

   [removed][removed]

   [removed][removed]

   [removed][removed]

   [removed][removed]

   [removed]

   /*global $ */

   $(function () {

    $('#file_upload').fileUploadUI({

    uploadTable: $('#files'),

    downloadTable: $('#files'),

    buildUploadRow: function (files, index) {

    return $('<tr><td>' + files[index].name + '<\/td>' +

     '<td class="file_upload_progress"><div><\/div><\/td>' +

     '<td class="file_upload_cancel">' +

     '<button class="ui-state-default ui-corner-all" title="Cancel">' +

     '<span class="ui-icon ui-icon-cancel">Cancel<\/span>' +

     '<\/button><\/td><\/tr>');

    },

    buildDownloadRow: function (file) {

     return $('<tr><td>' + file.name + '<\/td><\/tr>');

    }

    });

   });

   [removed] 

 &lt;/body&gt;

&lt;/html&gt;