JSON string wordt getoond na integratie van jQuery file upload in CakePHP
https://github.com/blueimp/jQuery-File-Upload) terecht gekomen. Het ziet er een degelijke file upload uit en maakt gebruik van Twitter Bootstrap, hetgeen ik ook gebruik voor m'n eigen CMS systeempje.
De integratie van jQuery file upload is m'n CMS systeem is zo goed als rond: de upload werkt en wordt naar een zelfbepaalde map weggeschreven. Het gaat echter fout wanneer ik de upgeloadde foto's in een lijst onder de knoppen wil tonen. De JSON string die de foto's ophaalt wordt namelijk geprint in plaats van achterliggend z'n ding te doen:
Is er iemand die een idee heeft hoe dit te verhinderen is?
Hier is de controller code binnen OutletPhotosController.php:
En dan de simpele initialisatie van het script in main.js:
<script>
$(function () {
'use strict';
// Initialize the jQuery File Upload widget:
$('#fileupload').fileupload({
});
});
</script>
Ik ben laatst op zoek gegaan naar een goede file upload module en ben uiteindelijk bij jQuery file upload (De integratie van jQuery file upload is m'n CMS systeem is zo goed als rond: de upload werkt en wordt naar een zelfbepaalde map weggeschreven. Het gaat echter fout wanneer ik de upgeloadde foto's in een lijst onder de knoppen wil tonen. De JSON string die de foto's ophaalt wordt namelijk geprint in plaats van achterliggend z'n ding te doen:
Quote:
{"files":[{"name":"foto1.jpg","size":221882,"url":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\foto1.jpg","thumbUrl":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\thumb\/foto1.jpg","deleteUrl":"http:\/\/cake.optiekcardoen.be\/app\/webroot\/index.php?file=foto1.jpg","deleteType":"DELETE"},{"name":"foto2.jpg","size":184839,"url":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\foto2.jpg","thumbUrl":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\thumb\/foto2.jpg","deleteUrl":"http:\/\/cake.optiekcardoen.be\/app\/webroot\/index.php?file=foto2.jpg","deleteType":"DELETE"},{"name":"foto3 (1).jpg","size":171300,"url":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\foto3%20%281%29.jpg","thumbUrl":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\thumb\/foto3%20%281%29.jpg","deleteUrl":"http:\/\/cake.optiekcardoen.be\/app\/webroot\/index.php?file=foto3%20%281%29.jpg","deleteType":"DELETE"},{"name":"foto3.jpg","size":171300,"url":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\foto3.jpg","thumbUrl":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\thumb\/foto3.jpg","deleteUrl":"http:\/\/cake.optiekcardoen.be\/app\/webroot\/index.php?file=foto3.jpg","deleteType":"DELETE"},{"name":"foto4.jpg","size":222763,"url":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\foto4.jpg","thumbUrl":"D:\\Websites\\Optiek Cardoen\\05 - Cake\\app\\webroot\\img\\outlets\\6\\thumb\/foto4.jpg","deleteUrl":"http:\/\/cake.optiekcardoen.be\/app\/webroot\/index.php?file=foto4.jpg","deleteType":"DELETE"}]}
Is er iemand die een idee heeft hoe dit te verhinderen is?
Hier is de controller code binnen OutletPhotosController.php:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php
public function add()
{
App::import('Vendor', 'CoasterCms.UploadHandler', array('file' => 'jQueryFileUpload' . DS . 'UploadHandler.php'));
App::import('Vendor', 'CoasterCms.CustomUploadHandler', array('file' => 'jQueryFileUpload' . DS . 'CustomUploadHandler.php'));
$options = array(
// foto's naar onderstaande map schrijven. Als map niet bestaat wordt ze automatisch aangemaakt
'upload_dir' => WWW_ROOT . 'img' . DS . 'outlets' . DS . $this->request->params['named']['outlet_id'] . DS,
// pad waar de foto's staan (JSON kijkt naar deze url om de upgeloade foto's in te laden
'upload_url' => WWW_ROOT . 'img' . DS . 'outlets' . DS . $this->request->params['named']['outlet_id'] . DS,
'accept_file_types' => '/\.(gif|jpe?g|png)$/i',
'image_versions' => array(
'thumb' => array(
'max_width' => 20,
'max_height' => 20,
'crop' => true
)
)
);
$upload_handler = new CustomUploadHandler($options);
}
?>
public function add()
{
App::import('Vendor', 'CoasterCms.UploadHandler', array('file' => 'jQueryFileUpload' . DS . 'UploadHandler.php'));
App::import('Vendor', 'CoasterCms.CustomUploadHandler', array('file' => 'jQueryFileUpload' . DS . 'CustomUploadHandler.php'));
$options = array(
// foto's naar onderstaande map schrijven. Als map niet bestaat wordt ze automatisch aangemaakt
'upload_dir' => WWW_ROOT . 'img' . DS . 'outlets' . DS . $this->request->params['named']['outlet_id'] . DS,
// pad waar de foto's staan (JSON kijkt naar deze url om de upgeloade foto's in te laden
'upload_url' => WWW_ROOT . 'img' . DS . 'outlets' . DS . $this->request->params['named']['outlet_id'] . DS,
'accept_file_types' => '/\.(gif|jpe?g|png)$/i',
'image_versions' => array(
'thumb' => array(
'max_width' => 20,
'max_height' => 20,
'crop' => true
)
)
);
$upload_handler = new CustomUploadHandler($options);
}
?>
En dan de simpele initialisatie van het script in main.js:
<script>
$(function () {
'use strict';
// Initialize the jQuery File Upload widget:
$('#fileupload').fileupload({
});
});
</script>
Ofwel dat, ofwel de verzendende kant (die de JSON serveert) verstuurt de verkeerde Content-Type header mee (terug), zodat de data verkeerd geinterpreteerd wordt.
Zoiets.
Dat is iig het eerste wat ik zou controleren.