#100736
astelcom
Member

Hello Peter,
Thanks for this first answer.
As a workaround, I tried to replace the row menu button by a link inside a grid column, but I experience issues while adding Events on these links !
I tried several ways :
In grid initialisation, I used a formatFunction inside the columns section , with the following code :

{label: 'Action', width: '30px', cellsAlign: 'right', allowResize: false, align: 'right', dataField: 'Status', allowGroup: false,
   formatFunction(settings) {
      if (settings.value === 'Active') {
         settings.template = '<div></div>';
      } else {
         settings.template = '<div></div>';
      }
   }
}

With the following eventHandling after the grid load :

	var oEnableItemList = document.querySelectorAll(".appenableitem");
	oEnableItemList.forEach(function(item) {
		item.addEventListener('click',function(event) {
			console.log(event.target);
		});
	});
	var oDisableItemList = document.querySelectorAll(".appdisableitem");
	oDisableItemList.forEach(function(item) {
		item.addEventListener('click',function(event) {
			alert(event.target);
		});
	});

Without any success : the DOMNodeLists of the querySelector are empty.
Other way :

{label: 'Action', width: '30px', cellsAlign: 'right', allowResize: false, align: 'right', dataField: 'Status', allowGroup: false,
   formatFunction(settings) {
      if (settings.value === 'Active') {
         settings.template = '<div></div>';
      } else {
         settings.template = '<div></div>';
      }
   }
}

 
With the following functions :

function enableMyItem(element) {
alert('enableItem');
}
function disableMyItem (element) {
alert('disableItem');
}

ends with :
ReferenceError : enableMyItem is undefined.
ReferenceError : enableMyItem is undefined.
Can you tell me where I’m wrong ? Did I miss something ?