向elFinder添加自定義上下文菜單項

我正在使用elfinder，並且我想通過向上下文菜單添加命令來添加新功能。我在項目的github問題跟蹤器上找到了一個解決方案，但是我無法使其工作。這是我做的：向elFinder添加自定義上下文菜單項

var elf; 
jQuery().ready(function() { 
    elFinder.prototype._options.commands.push('editimage'); 
    elFinder.prototype._options.contextmenu.files.push('editimage'); 
    elFinder.prototype.i18.en.messages['cmdeditimage'] = 'Edit Image';   
    elFinder.prototype.i18.de.messages['cmdeditimage'] = 'Bild bearbeiten'; 
    elFinder.prototype.commands.editimage = function() { 
     this.exec = function(hashes) { 
      console.log('hallo'); 
     } 
    } 
    elf = jQuery('#elfinder').elfinder({ 
    ... 
    //elfinder initialization

上下文菜單項不顯示，在控制檯中找不到錯誤消息。我也嘗試在初始化部分的contextmenu - >「files」下放置editimage以防被初始化覆蓋。

來源

2013-05-17 Martin Müller

我找到了解決方案：這些示例沒有顯示需要在elFinder.prototype.commands.yourcommand函數內部有函數this.getstate。它在啓用圖標時返回0，在禁用時返回-1。

因此，對於添加自己的菜單項或上下文菜單項中的全部代碼如下所示：

var elf; 
jQuery().ready(function() { 

    elFinder.prototype.i18.en.messages['cmdeditimage'] = 'Edit Image';   
    elFinder.prototype.i18.de.messages['cmdeditimage'] = 'Bild bearbeiten'; 
    elFinder.prototype._options.commands.push('editimage'); 
    elFinder.prototype.commands.editimage = function() { 
     this.exec = function(hashes) { 
      //do whatever 
     } 
     this.getstate = function() { 
      //return 0 to enable, -1 to disable icon access 
      return 0; 
     } 
    } 
    ... 
    elf = jQuery('#elfinder').elfinder({ 
     lang: 'de',    // language (OPTIONAL) 
     url : '/ext/elfinder-2.0-rc1/php/connector.php', //connector URL 
     width:'100%', 
     uiOptions : { 
      // toolbar configuration 
      toolbar : [ 
       ... 
       ['quicklook', 'editimage'], 
       /*['copy', 'cut', 'paste'],*/ 
       ... 
      ]}, 
     contextmenu : { 
      ... 
      // current directory file menu 
      files : [ 
       'getfile', '|','open', 'quicklook', 'editimage', ... 
      ] 
     } 
    }).elfinder('instance'); 

});

希望這可以幫助別人同樣的問題。

來源

2013-05-17 10:10:06

非常感謝你！ – KryDos

這終於挽救了許多小時的實驗。想知道爲什麼elFinder團隊不能像這樣的答案寫這樣的doccu。再次感謝。 – jm666

Yp這個技巧。太感謝了！ – Gogol

感謝您的回答，太棒了！

有一點不清楚的是變量是如何通過的。

所以，對於其他人誰發現這個頁面....

elFinder.prototype.commands.editpres = function() { 
    this.exec = function(hashes) { 
     var file = this.files(hashes); 
     var hash = file[0].hash; 
     var fm = this.fm; 
     var url = fm.url(hash); 
     var scope = angular.element("body").scope(); 
     scope.openEditorEdit(url); 
    } 
    // Getstate configured to only light up button if a file is selected. 
    this.getstate = function() { 
     var sel = this.files(sel), 
     cnt = sel.length; 
     return !this._disabled && cnt ? 0 : -1; 
    } 
}

爲了讓您的圖標顯示，以下內容添加到您的css文件：

.elfinder-button-icon-editpres { background:url('../img/icons/editpres.png') no-repeat; }

來源

2014-08-25 20:41:49

向elFinder添加自定義上下文菜單項

回答

相關問題