How can I delete files with CakePHP and Ajax?

Question

I'm in a page called 'add.cpt' that has a list of images. The user has the option to remove the images but I can't make it work. In the event of click I try to call an ajax trying to pass the name of the image and id of the item (.../item/imageName) but it does delete the image and alerts what seems to be the content of delete_photo_file.ctp. It looks like the ajax is using the URL but it is not sending the data to delete the file wanted.

ItemsController:

App::uses('File', 'Utility');
class ItemsController extends AppController{

[...]

public function deletePhotoFile(){
  //$this->autoRender = false; //did not tested but maybe I need to use this
  $imgName = //don't know how to get it from ajax call
  $itemId = //don't know how to get it from ajax call
  $file = new File($dir.'/'.$itemId.'/'.$imgName);
  $file->delete();
} 

}

Ajax Call (from my ctp file):

$('#delete').click(function (){
[...]

var itemId=$('#itemId').val(); //comes from hidden input
var imgName = $('#imgName').val(); //comes from hidden input

$.ajax({
  type: 'POST',
  url:'http://localhost/html/Project/v5/CakeStrap/items/deletePhotoFile/',
  data:{"itemId":itemId, imgName: imgName},
  success: function(data){
    alert(data); //alerts some HTML... seems to be delete_photo_file.ctp content
  }
});

});

Can anyone help me? Thanks!

"does not work"? how so? leans against its shovel and gossips all day? crashes? deletes the wrong file? writes naughty words in other files? — Marc B, Feb 25 '13 at 16:52
It looks like the ajax is using the URL but it is not sending the data to delete the file wanted. — Bagata, Feb 25 '13 at 16:55

Oldskool · Accepted Answer · 2013-02-25T17:05:17.120

2

In your ItemsController, make sure you actually load the File utility class, by adding:

App::uses('File', 'Utility');

Just below the opening <?php tag before your class definition. In your action you can just use $this->request->data to get the data keys. Also, return the action of the delete() function, so you can trigger your AJAX success/error call accordingly.

public function deletePhotoFile() {
    $imgName = $this->request->data['imgName'];
    $itemId = $this->request->data['itemId'];
    /**
     * Where is the $dir below actually set? Make sure to pass it properly!
     * Furthermore, it's always cleaner to use DS constant
     * (short for DIRECTORY_SEPARATOR), so the code will work on any OS
     */
    $file = new File($dir . DS . $itemId . DS . $imgName);
    return $file->delete();
}

Finally, mind your quotes in the AJAX call:

data:{"itemId":itemId, imgName: imgName},

Should become:

data:{"itemId":itemId, "imgName": imgName},

As otherwise, you just call the imgName JS var twice.

edited Feb 25 '13 at 17:05

answered Feb 25 '13 at 17:00

Oldskool

34,211
7
53
66

I forgot to put the `App::uses('File', 'Utility');` in the question but I was using it (edited it now). I'll try your answer, thanks a lot! – Bagata Feb 25 '13 at 17:05
I tried to use debug($imgName) and debug($itemId) and they are printing the right data but still not working. Maybe I made some mistake with the path of the file. – Bagata Feb 26 '13 at 00:43
Solved! Needed to use `WWW_ROOT`. `$dir = WWW_ROOT.'files' . DS . 'Item' . DS . $itemId . DS . $photoName;` – Bagata Feb 26 '13 at 02:02

Mavelo · Answer 2 · 2013-02-25T17:03:20.173

1

In the php $imgName = $this->request->data('imgName'); $itemId = $this->request->data('imgId'); In the js you might want to put quotes around the variable name since it's the same as the name of the value being passed data: {'itemId': itemId, 'imgName': imgName},

edited Feb 25 '13 at 17:03

answered Feb 25 '13 at 16:56

Mavelo

1,199
11
16

1

Accessing `$_POST` directly is not the CakePHP way. – Dunhamzzz Feb 25 '13 at 16:58
Just pointing out the issue, I use CI so the references would likely differ. Assume the poster knows enough to use the correct object to access the vars. Next time a correction instead of just a simple down-vote might be more helpful. something like... `$imgName = $this->request->data('imgName');` editing original response – Mavelo Feb 25 '13 at 17:02
sorry for the assumption. somebody did :( – Mavelo Feb 25 '13 at 19:06

score 0 · Answer 3 · answered Feb 25 '13 at 16:57

0

To get the data out simply debug($this->request->data) in your deletePhotoFile() method and check the response in your browsers console, it should be a nicely formatted array with the data you POST`d over in your ajax request, you should be able to work out the rest from there.

You'll also want to look into using the RequestHandler component so you can assure the request is an ajax request.

answered Feb 25 '13 at 16:57

Dunhamzzz

14,682
4
50
74

Thanks, I'll give it a try. And how about my code to delete the file? Is it correct? (`$file = new File($dir.'/'.$itemId.'/'.$imgName); $file->delete();`). – Bagata Feb 25 '13 at 16:59
I'm not 100% sure as I've never worked with the File class myself, best bet is to just try it and see. – Dunhamzzz Feb 25 '13 at 17:00

How can I delete files with CakePHP and Ajax?

3 Answers3