IgGrid - How to connect custom feature chooser to the grid?

Question

In my project I use igGrid from ignite-ui. In headers of columns there are gears. If user clicks gear then a popover apears (feature chooser). My task is to implement custom feature chooser - when user clicks on the gear then my custom feature chooser should apear instead of the built-in feature chooser.

I know how to implement the custom feature chooser and options like sorting, grouping, column moving etc. The problem is that I can't find out how to overwrite the gear click event.

Answer 1

You'll have to find the gear icons and unbind mousedown event to prevent feature chooser to pop up. After that you can bind to mousedown using custom handler to show the custom feature chooser.

rendered: function(e, ui) {
    ui.owner.headersTable()
    .find("a[data-fc-button]")
    .off("mousedown")
    .on("mousedown", (e) => {
        //open your own featurechooser here
    });
},

Here's a fiddle to demonstrate this - http://jsfiddle.net/dkamburov/da276b5w