how can I change the default methods of tools?

[tmzl]

I would like to change the default methods of tools like "createFolder", and I would like to click on "createFolder" to open my own url,Where i can customize it？

[Karthik Ravichandran]

Dear Customer, 

 

Thanks for contacting Syncfusion support. 

 

We have checked your query. You can achieve your requirement using toolList and tools API of ejFileExplorer. Please refer the below code block. 

 

[script] 

var toolsList = ["layout", "creation", "navigation", "addressBar", "editing", "copyPaste", "getProperties", "customTool", "searchBar"]; 

var tools = ej.FileExplorer.prototype.defaults.tools; 

tools.customTool = [{ 

    name: "Help", 

    tooltip: "Help ", 

    css: "e-fileExplorer-toolbar-icon Help", 

    action: function () { 

        window.open("https://help.syncfusion.com/js/fileexplorer/toolbar#custom-tool-in-toolbar") 

    } 

}]; 

 

$("#fileExplorer").ejFileExplorer({ 

    toolsList: toolsList, 

    tools: tools, 

    path: "http://js.syncfusion.com/demos/ejServices/Content/FileBrowser/", 

    ajaxAction: "http://js.syncfusion.com/demos/ejServices/api/FileExplorer/FileOperations", 

}); 

 

 

For your convenience, we have attached the sample below, 

 

http://jsplayground.syncfusion.com/pbcbs2ij 

 

To know more details about ejFileExplorer, please refer the below link. 

 

UG: https://help.syncfusion.com/js/fileexplorer/getting-started 

 

API: https://help.syncfusion.com/api/js/ejfileexplorer 

 

Online Demo: http://js.syncfusion.com/demos/web/#!/azure/fileexplorer/CustomTool 

 

Please let us know if you need further assistance on this. 

 

Regards, 

Karthik R 

[tmzl]

Thanks for reply，I know to use customTool, but if i need multiple customTool, and i need a place on the new folder, the other is placed in front of the details。

[Karthik Ravichandran]

Dear Customer, 

 

Thanks for your update. 

 

You can achieve your requirement in ejFIleExplorer Create event by moving the created custom tool element using insertAfter method in jQuery. Please refer the below code block. 

 

$(function () { 

    $("#fileExplorer").ejFileExplorer({ 

        isResponsive: true, 

        width: "100%", 

        minWidth: "150px", 

        fileTypes: "*.png,*.gif,*.jpg,*.jpeg,*.docx", 

        toolsList: toolsList, 

        layout: "largeicons", 

        tools: tools, 

        path: "http://js.syncfusion.com/demos/ejServices/Content/FileBrowser/", 

        ajaxAction: "http://js.syncfusion.com/demos/ejServices/api/FileExplorer/FileOperations", 

        create : "onCreate" 

    }); 

 

}); 

 

function onCreate(args){ 

    $(this._toolBarObj.items).filter($('li#' + this.element.attr('id') + 'CreateFolder').insertAfter("ul li:eq(0)") ) 

} 

 

 

For your convenience, we have attached the sample below. 

 

http://jsplayground.syncfusion.com/jatufk3r 

 

Please let us know if you need further assistance on this. 

 

Regards, 

Karthik R