contextmenu 적용

마우스의 우측 버튼 클릭을 통해 contextmenu를 출력할 수 있습니다.
header의 영역과 data영역 2군데 별도의 형태의 설정이 가능하며, data영역 중 특정 컬럼에서의 별도의 형태의 생성도 가능합니다.
qcell.setContextmenu(
{
  header: {
   id: "header-contextmenu",
   contents:
   [
    {icon: '<i class="fas fa-plus"></i>', label: '메뉴header-a', callback: function(){qcell.addRow();}},
    {divine: true},
    {icon: '<i class="fas fa-minus"></i>', label: '메뉴header-b', callback: function(){qcell.removeRow();}}
   ]
  },
  data: {
   base: {
    id: 'base-contextmenu',
    contents:
    [
     {icon: '<i class="fas fa-plus"></i>', label: '메뉴base-a', callback: function(){qcell.addRow();}},
     {icon: '<i class="fas fa-minus"></i>', label: '메뉴base-b', callback: function(){qcell.removeRow();}},
     {divine: true},
     {label: 'base-c', items:
      [
       {icon: '<i class="fas fa-copy"></i>', label: 'base-c-1', callback: "objClick" },
       {icon: '<i class="fas fa-paste"></i>', label: 'base-c-2', callback: "objClick" }
      ]
      , disabled: true
     }
    ]
   },
  except: [
   {
    col: 3,
    id: 'except1-contextmenu',
    contents:[
     {label: 'except1-d', items:
      [
       {icon: './images/hard.png', label: 'except1-d-1', items:
        [
         {icon: './images/flash.png', label: 'except1-d-1-1', callback: "objClick" },
         {label: 'except1-d-1-2', callback: "objClick" }
        ],
       callback: "objClick"
       },
       {label: 'except1-d-2', items:
        [
         {label: 'except1-d-2-1', callback: "objClick" },
         {label: 'except1-d-2-2', callback: "objClick" },
        ],
       callback: "objClick"
       }
      ],
     callback: "objClick"
      }
     ]
    }
   ]
  }
}

function objClick(obj){
  alert(obj.label + ' click');
}