jQuery File Upload read files from database - php

Question

I am trying to create custom class for jQuery File Upload plugin. I succeeded inserting data to my database however I can't read files from the database. Since I am not very familiar with object oriented programming I couldn't figure out where is the problem. Also there is not enough documentation for that.
class CustomUploadHandler extends UploadHandler {
public function get($print_response = true) {
$db = new DB;
$query = $db->get_rows("SELECT * FROM `files` ORDER BY `name`");
foreach ($query as $row)
{
$file = new stdClass();
$file->id = $row->id;
$file->name = $row->name;
$file->size = $row->size;
$file->type = $row->type;
$file->title = $row->title;
$file->url = $row->url;
$file->thumbnail_url = $row->thumbnail;
$file->delete_url = "";
$file->delete_type = "DELETE";
}
return $this->generate_response($query, $print_response);
}
}
I also have that in my js file :
// Load existing files:
$('#fileupload').addClass('fileupload-processing');
$.ajax({
// Uncomment the following to send cross-domain cookies:
//xhrFields: {withCredentials: true},
url: $('#fileupload').fileupload('option', 'url'),
dataType: 'json',
context: $('#fileupload')[0]
}).always(function () {
$(this).removeClass('fileupload-processing');
}).done(function (result) {
$(this).fileupload('option', 'done')
.call(this, $.Event('done'), {result: result});
});

Answer 1

I found myself with the same problem, and after doing some research i didn't found anything in the docs, so i did a workaround.
Basically i studied how is the object that the library it's sending to the front to be maped, and i rewrite the get function in my index.php from the handler in my CustomHandler.
The contra that i found, is that i started to save the size of the image in my database when is not needed, but anyway works well.
public function get($print_response = true) {
if ($print_response && $this->get_query_param('download')) {
return $this->download();
}
//this is my filter for the data the post_id
//see the main.js to see how i send it
$postId = $_GET['post_id'];
$arrayObjects = array();
$sql = 'SELECT `id`, `name`, `size` ,`post_id`, `path_img`, `descripcion` FROM `'
.$this->options['db_table'].'` WHERE `post_id`=?';
$query = $this->db->prepare($sql);
$query->bind_param('i', $postId);
$query->execute();
$query->bind_result(
$id,
$name,
$size,
$post_id,
$path_img,
$descripcion
);
// in $this->base_url i have the http:// value from my host
while ($query->fetch()) {
$arrayObjects[] = (object) array("name"=>$name,
"size"=>$size,
"url"=> $this->base_url.$path_img."/".$name
,"thumbnailUrl"=> $this->base_url.$path_img."/thumbnail/".$name
,"deleteUrl"=>$this->base_url."galeria/server/php/index.php?file=".$name."&_method=DELETE"
,"deleteType"=>'POST');
}
/* this is the object that you need to send to the front
* [name] => Captura de pantalla 2016-06-30 a las 4.40.10 p.m..png
* [size] => 61921 [url] => http://localhost/papmendoza/wp-content/uploads/galeria/Captura%20de%20pantalla%202016-06-30%20a%20las%204.40.10%20p.m..png
* [thumbnailUrl] => http://localhost/papmendoza/wp-content/uploads/galeria/thumbnail/Captura%20de%20pantalla%202016-06-30%20a%20las%204.40.10%20p.m..png
* [deleteUrl] => http://localhost/papmendoza/galeria/server/php/index.php?file=Captura%20de%20pantalla%202016-06-30%20a%20las%204.40.10%20p.m..png&_method=DELETE
* [deleteType] => POST )
*
*/
$response = array(
$this->options['param_name'] => $arrayObjects
);
return $this->generate_response($response, $print_response);
}
And in my main.js i have something like this
// i have a select in my custom form and i need the file uploader change
//with my select so here i basically do that
$('#noticia').on('change', function () {
var post_id = this.value; // or $(this).val()
$('#fileupload').addClass('fileupload-processing');
$.ajax({
url: $('#fileupload').fileupload('option', 'url') + '?post_id=' + post_id,
dataType: 'json',
context: $('#fileupload')[0]
}).always(function () {
$(this).removeClass('fileupload-processing');
}).done(function (result) {
//you need to remove the files first
$("#fileupload").find(".files").empty();
$(this).fileupload('option', 'done').call(this, $.Event('done'), {result: result});
});
});