Client event API - Studio-42/elFinder GitHub Wiki

Most of elFinder events pass some data to event handlers. This data stored in event.data, can be object, string or undefined.

Events handlers can be attached in two ways:

On elFinder init

$('selector').elfinder({
    // options ...
    handlers : {
        select : function(event, elfinderInstance) {
            console.log(event.data);
            console.log(event.data.selected); // selected files hashes list
        }
    }
});

After elFinder init:

var elfinder = $(selector).elfinder(options).elfinder('instance');
// or
var elfinder = new window.elFinder(document.getElementById('my-id'), options);

elfinder.bind('upload', function(event) { ... });
elfinder.unbind('load', function(event) { ... });

elfinder.one('load', function(event) { ... }); // execute once and unbind event after, similar to jQuery.one()

Event list

  • init called once after elFinder node created
  • load called once elFinder got first connector response
  • api called once elFinder got first connector response and event.data contains api version
  • enable elFinder get focus
  • disable elFinder lost focus
  • open on folder open
  • select called on file(s) select/unselect
  • dblclick called on file double click
  • add called when file(s) added (fired by several commands)
  • remove called when file(s) removed (fired by several commands)
  • change called when file was changed (fired by several commands)
  • upload called on file(s) upload
  • sync called on elFinder content syncing (command "reload")
  • changeclipboard called on copy/cut
  • paste called on paste of copied files
  • rename
  • duplicate
  • download
  • get called when got response with file content to edit
  • resize
  • archive
  • extract
  • contextmenu
  • hover called on mouseleave/mouseenter file area in cwd
  • viewchange on icons/list view change
  • sortchange
  • searchstart after user pressed enter in search field
  • search when got search results
  • searchend when search field cleaned
  • destroy after elFinder instance destroyed
  • hide after elFinder hided
  • show after elFinder showed

EventName + "done" event (>= elFinder 2.1.15)

The event [event]done will fire at after calling all of the [event] callbacks. No data is passed to this callbacks.

EventName + "fail" event (>= elFinder 2.1.16)

The event [event]fail will fire if it fails to execute this event command. The response of the back-end has been saved in the event.data.

"request." + Command Name (>= elFinder 2.1.20)

Command execution can be canceled. (Live Demo)

The callback event.data object

{
     opts: {...}, // Options object that passed to request()
     result: true // Value to control command execution
}

is passed. event.data object is changeable in callback. To cancel command execution, set event.data.result to false, or set jQuery.Deferred object to event.data.result and asynchronously call jQuery.Deferred().reject(). When setting the jQuery.Deferred object, calling jQuery.Deferred().resolve() will execute the suspended command.