This topic explains how to attach events in jQuery and MVC and provides a reference about the events that are specific to column management.
This topic contains the following sections:
There are a couple of events related to column management. (See the Events Reference Chart below).
Also, all events with the -ing suffix are cancelable and the action can be terminated when in the handler is set to return false.
In Javascript:
$("#grid1").igGrid({
features: [
{
name: 'Hiding',
columnHiding: function (ui, args) {
return false;
}
}
]
});
Most of the argument methods and properties contain row-specific data and an identification of the grid they belong to.
To attach to an event, the only thing you need to define is a handler for it, just like you define a property. Then when the event is triggered, the handler will be called.
In Javascript:
$("#grid1").igGrid({
features: [{
name: 'Hiding',
columnHiding: function (e, args) {
// Handle event
}
}]
});
When attaching a handler in MVC, you need to use the jQuery User Interface (UI) pattern, which mandates concatenating the name of the control and event in lower-case letters.
In Javascript:
$("#grid1").on("iggridhidingcolumnhiding ", function (e, args) {
// Handle event
});
Note: The jQuery’s
on
function is used in case some DOM elements are added after attaching to the handler.
Note: In the following table, the events specific to the Hiding Column Chooser are listed. They are available also in the Hiding Column Chooser topic.
Event | Description | Cancelable |
---|---|---|
columnHiding | Event fired before a hiding operation is executed | True |
columnHidden | Event fired after the hiding has been executed and results are rendered | False |
columnShowing | Event fired before a showing operation is executed | True |
columnShown | Event fired after the showing has been executed and results are rendered | False |
columnChooserOpening | Event fired before the column chooser is opened | True |
columnChooserOpened | Event fired after the column chooser is already opened | False |
columnChooserMoving | Event fired every time the column chooser changes its position | False |
columnChooserClosing | Event fired before the column chooser is closed | True |
columnChooserClosed | Event fired after the column chooser has been closed | False |
columnChooserContentsRendering | Event fired before the contents of the column chooser are rendered | True |
columnChooserContentsRendered | Event fired after the contents of the column chooser are rendered | False |
columnChooserButtonApplyClick | Event fired when button Reset in column chooser is clicked | False |
columnChooserButtonResetClick | Event fired when button Reset in column chooser is clicked | False |
The following topics provide additional information related to this topic.
View on GitHub