Adding a delete button to an interactive grid

on


You want to add a delete button as shown


Method

Add the button to your interactive grid by adding code to "Javascript Initialization code" field in the attributes of your IG.


Code:

function(config) {
  let $             = apex.jQuery,
      toolbarData   = $.apex.interactiveGrid.copyDefaultToolbar(), // Copy the default toolbar
      toolbarGroup  = toolbarData.toolbarFind("actions3"); // Get the group you want to put your controls into
  
    toolbarGroup.controls.push({type: "BUTTON",
                            id: "static",
                            label: "Delete Row",
                            icon: false, //or icon: "icon-ig-delete"
                            iconBeforeLabel: true,
                            //iconOnly: true,
                            //hot: true,
                            //class: "a-Button-label"
                            disabled: false,
                            action: "selection-delete"
                         });

    
  config.toolbarData = toolbarData;
  return config;
}

There is no other code required, when the button is pressed, it will delete the selected row.
 
16-Aug-21 Update: There is a comprehensive blogpost on adding various buttons to IGs here:
https://tm-apex.blogspot.com/2021/03/customize-your-toolbar-interactive-grid.html

Acknowledgement

https://www.stinolez.com/2018/10/25/interactive-grids-more-customization/ 
https://svenweller.wordpress.com/2017/10/27/apex-5-1-interactive-grids-how-to-customize-toolbar-buttons/ 




Comments

Post a Comment