Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery File Tree - how to return folder name on folder click

I have installed and trying to customize Jquery File Tree so that, on click of folder name, the folder name and path are returned to the calling function. Currently it only expands and collapses folders, and returns the file name on click of file.

So I need to return the folder too and cannot see where that is triggered.

I am using the php connector. Below link is where I downloaded the sample code: http://abeautifulsite.net/blog/2008/03/jquery-file-tree/

thanks, Ed

like image 524
Edd Avatar asked Jan 22 '23 05:01

Edd


1 Answers

Not sure if there is an "API" way to do it. But if you look at the source code (Line 64-81)

if( $(this).parent().hasClass('directory') ) {
    if( $(this).parent().hasClass('collapsed') ) {
        // Expand
        if( !o.multiFolder ) {
            $(this).parent().parent().find('UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
            $(this).parent().parent().find('LI.directory').removeClass('expanded').addClass('collapsed');
        }
        $(this).parent().find('UL').remove(); // cleanup
        showTree( $(this).parent(), escape($(this).attr('rel').match( /.*\// )) );
        $(this).parent().removeClass('collapsed').addClass('expanded');
    } else {
        // Collapse
        $(this).parent().find('UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
        $(this).parent().removeClass('expanded').addClass('collapsed');
    }
} else {
    h($(this).attr('rel'));
}

Looks like you can call another function inside the hasClass('directory') if clause and it will work.

So you could:

Change Line 36 to be

fileTree: function(o, h, dire) {

Between 65 and 66 add

dire($(this).attr('rel'));

If you want to have more control/flexibility/information, you can do dire($(this)); , and it will send the jQuery object instead of just the rel attribute.

Example:

$(document).ready( function() {
    $('#container_id').fileTree({ root: '/some/folder/' }, function(file) {
        // do something when a file is clicked
    }, function(dir){
        // do something when a dir is clicked
    });
});

I have not tested it, you might need to change a couple of things around.

like image 137
Kshitij Parajuli Avatar answered Feb 19 '23 20:02

Kshitij Parajuli