ABGrid Engine

                
function onActionClick (action, row, column, grid) {
  grid.msg("Действие : " + action,"Информация: Обработчик действий");
}
const cfgDemo = {
  readOnly:true,
  // ===== ЗАГРУЗКА ТАБЛИЦЫ =====
  autoLoad: true,
  data: {
    dataKey: 'gridP',
    url: '/api/demo/simple'
  },
  // ===== SCHEMA =====
  schema: {
    fields: {
      id: {type: 'int', ui: {label: 'id', grid: {visible: false}}},
      categoryId: {type: 'int', ui: {label: 'categoryId', grid: {visible: false}}},
      category: {type: 'string', ui: {label: 'Категория', grid: {visible: true, width: '20%'}}},
      name: {type: 'string', ui: {label: 'Наименование', grid: {visible: true, width: '60%'}}},
      price: {type: 'number', ui: {label: 'Цена', grid: {visible: true, width: '15%'}}},
      actions: { type: 'text',
        ui: { label: 'Действия',
              grid: { visible: true, width: '20%', colType: 'actions',
                      actions: {
                         edit: { classes: 'fa fa-pencil',
                                 'aria-label': 'Редактирование', hint: 'Редактирование' },
                         trash: { classes: 'fa fa-trash-can',
                                  'aria-label': 'Удалить', hint: 'Удалить' }
                      }
              }
        }
      }
    }
  },
  // ===== VIEW =====
  view: {
    height:230,
    checkbox: false,
      tableTitle: {
        enabled: true,
        caption:'Продукция',
        hint: 'Продукция нашего магазина',
        toggle: true
      },
    pager: {
      enabled: true,
        rpp: [3, 5, 10]
    }
  }
};
const gridDemo = new ABGrid("#demogrid", cfgDemo);
gridDemo.onActionClick(onActionClick);