DayPilot.Menu.items

Holds an array of menu items.

Example of an event menu:

menu.items = [
  {text:'Details', onClick: function(args) { var e = args.source;  DayPilot.Modal.alert("Event text: " + e.text()); },
  {text:'-' },  // separator
  {text:'Delete', onClick: function(args) { dp.events.remove(args.source); },
];

Menu Item Structure

The menu item object has the following properties:

  • text (string): The menu item text to be displayed. Use "-" to show a separator. Required.
  • href (string): The URL to be opened on menu item click. The "{0}" string will be replaced with the event id.
  • onClick (function): JavaScript function to be called on menu item click. The menu source object (event or time range) is stored in args.source, the menu item can be accessed using args.item.
  • command (string): The command to be invoked on the server side (EventMenuClick or TimeRangeMenuClick event)
  • action (string): Method of invoking the menu item command on the server side: "CallBack" or "PostBack" ("CallBack" is the default value) - only applies to ASP.NET WebForms, ASP.NET MVC and Java versions
  • disabled (boolean): If set to true the menu item will be marked as disabled with "*_item_disabled" CSS class and no action will be fired on click (since version 8.0.1591)
  • hidden (boolean): Set to true to hide the item (useful when modifying the menu items dynamically)
  • icon (string): CSS class(es) that specify a font icon (e.g. "fas fa-user" for Font Awesome)
  • image (string): URL of the menu item icon
  • items (array): array of submenu items
  • cssClass (string): Custom CSS class that will be added to the menu item (since version 8.2.3146)

Only one type of menu click action is invoked. The order of processing is as follows:

  • href
  • onclick
  • command

Menu item examples

JavaScript action

{text:'Open', onClick: function(args) { var e = args.source; alert('Opening event (id ' + e.id() +')'); } }

Separator

{text:'-' }

Server-side action invoked using CallBack (ASP.NET MVC, ASP.NET WebForms, Java)

{text:'Delete (CallBack)', command: 'Delete', action: 'CallBack' }

Server-side action invoked using PostBack (ASP.NET WebForms only)

{text:'Delete (PostBack)', command: 'Delete', action: 'PostBack' }

URL

{text:'Open Google', href: 'http://www.google.com/?q={0}' }

Using a Font Awesome Icon

{text: "User details...", icon: "fas fa-user" }