How to enable/disable toolbar item/items
17 Feb 20223 minutes to read
The toolbar items can be enabled/disabled by specifying the items in enableToolbarItems
or disableToolbarItems
methods respectively.
The following example shows enabling and disabling toolbar items on button click.
The new toolbar button is added using toolbarSettings. The toolbarClick event is used to add an event handler to the new toolbar button.
@{
string[] items = new string[] { "NewFolder", "Upload", "Delete", "Download", "Rename", "SortBy", "Refresh", "Selection", "View", "Details", "Custom" };
}
<div class="control-section">
<div class="sample-container">
<!-- Filemanager element declaration -->
@Html.EJS().FileManager("file").AjaxSettings(new Syncfusion.EJ2.FileManager.FileManagerAjaxSettings()
{
Url = "/Home/FileOperations",
GetImageUrl = "/Home/GetImage",
UploadUrl = "/Home/Upload",
DownloadUrl = "/Home/Download"
}).ToolbarSettings(new Syncfusion.EJ2.FileManager.FileManagerToolbarSettings()
{
Items = items
}).ToolbarClick("toolbarClick").ToolbarCreate("onCreate").Render()
<!-- end of filemanager element -->
</div>
</div>
<script>
// event for custom toolbar item
function toolbarClick(args) {
if (args.item.text === 'Custom') {
alert('You have clicked custom toolbar item')
}
}
function onCreate(args) {
for (var i = 0; i < args.items.length; i++) {
if (args.items[i].id === this.element.id + '_tb_custom') {
args.items[i].prefixIcon = 'e-icons e-fe-tick';
}
}
}
</script>
<style>
.e-fe-tick::before {
content: '\e614';
}
</style>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNetCore.Mvc;
namespace WebApplication.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
}
}
Output be like the below when enable toolbar item.
Output be like the below when enable toolbar item.