Custom onclick in pivot fields

popup: {
            minWidth: 400,

            on: {
              onViewInit(name, config) {

                if (name === "fields") {
                  config.view = "tree";
                  config.activeTitle = true;
                  config.template = (item, common) => {
                   const value = item.$count ? item.value : item.text;
                   return `${common.icon(item, common) +
                      common.folder(item, common)}<span>${value}</span> ${
                      item.$count
                        ? ""
                      : `<button class="delbtn">del</button> <button class="edit">edit</button>`
                      }`;
                  }

How to add handlers (click) for buttons with classes “delbtn” and “edit”?

onClick is set before widget initialization (in this case, a tree) as an object like:

popup:{
        on:{
          onViewInit: function(name, config){
            // replace list with a tree
            if(name == "fields"){ 
              ...
              config.onClick = {
                delbtn (e, id, trg) {
                  webix.message("Delete row: " + id);
                  return false; // here it blocks the default behavior
                },
                edit (e, id, trg) {
                  webix.message("Edit row: " + id);
                  return false; 
                }
              };
            }
          }
        }
      }

Please take into account that deleting fields from a tree does not affect the fields actually stored in the pivot - it’s depend only on the source data.

Sample: https://snippet.webix.com/iv92weym