JSFiddle - React, Tailwind, and code Playground
JavaScript
Ext.define('CategoryEditor.com.applayout.ImagesGrid', {
extend: 'Ext.grid.Panel',
requires: [
'CategoryEditor.com.store.ImageStore',
'CategoryEditor.com.store.CategoryImageTypeStore',
'Ext.grid.plugin.CellEditing'
],
alias: 'widget.imagesgrid',
initComponent: function () {
debugger;
var me = this;
me.viewConfig = {
markDirty: false
};
me.store = Ext.create('CategoryEditor.com.store.ImageStore');
me.storeImageTypes = Ext.create('CategoryEditor.com.store.CategoryImageTypeStore');
me.storeImageTypes.getProxy().extraParams.objectId = this.objectId;
me.columns = me.getColumns();
me.listeners = {
itemcontextmenu: me.showContextMenu
};
me.doLoad();
me.superclass.initComponent.call(this);
},
showContextMenu: function (view, record, item, index, e, eOpts) {
var me = this;
// stop event so browser's normal right-click action doesn't continue
e.stopEvent();
// if a menu doesn't already exist, create one
if (!item.contextMenu) {
// add menu
item.contextMenu = new Ext.menu.Menu({
items: [{
text: 'Delete',
iconCls: 'icon_edit',
handler: function (item, e) {
debugger;
//should do a direct call
}
}]
});
}
// show menu relative to item which was right-clicked
item.contextMenu.showBy(item);
},
doLoad: function () {
var me = this;
var params = {
params: {
objectId: this.objectId
}
};
me.storeImageTypes.load();
me.store.load(
params
);
},
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
...