Don't propagate click when clicking on header filter (#12130)

This commit is contained in:
Charles Gagnon
2020-09-03 21:36:11 -07:00
committed by GitHub
parent 1e5ab4d9f0
commit 787245b058

View File

@@ -14,10 +14,16 @@ interface IExtendedColumn<T> extends Slick.Column<T> {
filterValues?: Array<string>; filterValues?: Array<string>;
} }
export interface CommandEventArgs<T extends Slick.SlickData> {
grid: Slick.Grid<T>,
column: Slick.Column<T>,
command: string
}
export class HeaderFilter<T extends Slick.SlickData> { export class HeaderFilter<T extends Slick.SlickData> {
public onFilterApplied = new Slick.Event(); public onFilterApplied = new Slick.Event();
public onCommand = new Slick.Event(); public onCommand = new Slick.Event<CommandEventArgs<T>>();
private grid!: Slick.Grid<T>; private grid!: Slick.Grid<T>;
private handler = new Slick.EventHandler(); private handler = new Slick.EventHandler();
@@ -82,10 +88,16 @@ export class HeaderFilter<T extends Slick.SlickData> {
.addClass('slick-header-menubutton') .addClass('slick-header-menubutton')
.data('column', column); .data('column', column);
$el.bind('click', (e: KeyboardEvent) => this.showFilter(e)).appendTo(args.node); $el.bind('click', (e: KeyboardEvent) => {
this.showFilter(e);
e.preventDefault();
e.stopPropagation();
}).appendTo(args.node);
$el.bind('keydown', (e: KeyboardEvent) => { $el.bind('keydown', (e: KeyboardEvent) => {
if (e.key === 'Enter' || e.keyCode === 13) { if (e.key === 'Enter' || e.keyCode === 13) {
this.showFilter(e); this.showFilter(e);
e.preventDefault();
e.stopPropagation();
} }
}).appendTo(args.node); }).appendTo(args.node);
} }
@@ -377,9 +389,9 @@ export class HeaderFilter<T extends Slick.SlickData> {
this.hideMenu(); this.hideMenu();
this.onCommand.notify({ this.onCommand.notify({
'grid': this.grid, grid: this.grid,
'column': columnDef, column: columnDef,
'command': command command: command
}, e, self); }, e, self);
e.preventDefault(); e.preventDefault();