search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

How to edit Queue items

Related article: Angular Scheduler: Drag and Drop Task Queue
Asked by Anonymous
11 months ago.

How to edit name of items in the queue and how can I add custom fields.

Answer posted by Dan Letecky [DayPilot]
10 months ago.

To edit the queue items, you can add another item (“Edit”) to the context menu:

It will open a modal dialog with task details:

This context menu can be defined like this:

queueConfig: DayPilot.QueueConfig = {
  contextMenu: new DayPilot.Menu({
    items: [
        text: "Edit...",
        onClick: async (args) => {
          const form = [
            {name: "Text", id: "text"},
            {name: "Type", id: "type", type: "select", options: [
              {name: "Type 1", id: "type1"},
              {name: "Type 2", id: "type2"},

          const data =;
          const modal = await DayPilot.Modal.form(form, data);
          if (modal.canceled) {

        text: "Delete",
        onClick: (args) => {

To display the custom field in the task item, you can use the onBeforeEventRender event:

onBeforeEventRender: (args) => { = DayPilot.Util.escapeHtml( + "<br>" +;
  // ...

This example assumes you are working with the Angular project from the Angular Scheduler: Drag and Drop Task Queue tutorial.

This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.