Insert a component via a menu

Here you will add an item to the insert menu you created in the Work with menus (Trader 3.6.3 onwards) page.

As you did with the populateLayoutMenu function, create a populateInsertMenu function, in which you have one item that will insert an FX Majors grid component:

function populateInsertMenu() {
    var model ={
        options: {
            label: ct.i18n(''),
            classifier: 'menu-insert',
            type: 'onclick-submenu'
        items: [
                options: {
                    label: ct.i18n('griddefinitions.major_fx'),
                    eventName: 'menu-insert-fx-majors',
                    classifier: 'menu-insert-fx-majors'
    return model;

then add a matching handler triggered by menu-insert-fx-majors, which creates a grid component and inserts it into the layout:

model.on('menu-insert-fx-majors', function() {
    var caption = ct.i18n('griddefinitions.major_fx');
    var xml = '<caplin.grid-component baseGrid="caplinx.fxtrader.slgrid.fxMajor"/>';
    var component = caplin.component.ComponentFactory.createComponent(xml);
    var layoutService = caplin.core.ServiceRegistry.getService('caplin.layout-service');
    var layout = layoutService.getSelected();
    layout.insertComponent(component, caption);

Now re-load the app and you should have a single item in the Insert menu that inserts a grid. You can drag this into place in the layout.

Screenshot of item in insert menu