Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

In jsTree how to prevent deletion of folder if not empty

Tags:

jquery

jstree

I have a tree made up of folders and files that represent images (instead of documents).

I'm trying to prevent the images from being deleted while allowing for the folders to be added, renamed, moved and deleted.

Using jsTree types I can prevent deletion of the images BUT not if the images are inside a folder.

If these same images are in a folder, the folder will be deleted with all the images.

Any suggestions in how to prevent deletion of a folder that is not empty -- that has images in it?

I tried putting a function inside the "types" "delete_node" but I'm having a terrible time identifying the folder being deleted. I've had no luck using $(this).

Here is my latest attempt. Trying to test for images before the delete_node is sent --

.bind("before.jstree", function (e, data) {
   if(data.func === "delete_node") {  
       if ($(e.currentTarget).find("[rel='imgIR']")){    // rel='imgIR' identifies images
           alert("Folder must be empty to delete it.");
           e.stopImmediatePropagation();
           return false;
       } else {
          return true;
       }
    }
})

And it works in that it stops it from deleting. But it stops delete every time, with or without images.

When I send (e.currentTarget).html() to the console log, the whole tree is included, not just the folder slated for deletion. And I cant find a way to select the specific folder.

The plugins that I'm using are:

"plugins" : [ "html_data", "types", "themes", "ui", "crrm", "contextmenu", "dnd" ]

Any and all help would be appreciated. Thanks!

* OK, I've had some progress but a new setback.

Using Array.prototype.slice.call(arguments, 1) I was finally able to find that data.args[0][0] gives me the specific node. But now I'm getting an error from jquery.jstree.js line 234 that I'm stuck on.

The error: Uncaught TypeError: Function.prototype.apply: Arguments list has wrong type

Here is what my code looks like now. The error comes at the inside if statement.

.bind("before.jstree", function (e, data) {
   if(data.func === "delete_node") { 
       var node = data.args[0][0]; 
           if ($(node).children('li[rel="imgIR"]').length != 0){    // rel='imgIR' identifies images
               alert("Folder must be empty to delete it.");
               e.stopImmediatePropagation();
               return false;
           } else {
          return true;
           }
    }
})
like image 999
AlexGM Avatar asked Nov 12 '22 03:11

AlexGM


1 Answers

Solved!

Now I can test for image entries in folders before they can be deleted. In fact it can be used to test for any other element before deleting a folder.

.bind("before.jstree", function (e, data) {
   if(data.func === "delete_node") { 
       var node = data.args[0][0]; 
           if ($(node).find('li[rel="imgIR"]').length != 0){    // rel='imgIR' identifies images
               alert("Folder must be empty to delete it.");
               e.stopImmediatePropagation();
               return false;
       } 
   }
})

First I changed my if statement to find instead of children because I needed to drill down more than one level to find the images. Once I was able to produce a true result from the if statement I realized that the error I was getting came from the }else{} part of my if statement. Returning true; is what was causing the error. Nothing needs to be returned for the deletion to go forward.

Now it works like a charm.

like image 55
AlexGM Avatar answered Nov 15 '22 07:11

AlexGM