On my angular application I have a UI-Grid and a button to open a modal window. In my gridoptions I enabled external filtering. But the problem is whenever I enter the filter field and press enter the button(modal window) is triggered and the modal opens up. I don't have any key events inside my controller.
Here are my gridoptions for the ui-grid:
gridOptions: uiGrid.IGridOptionsOf<any> = {
appScopeProvider: this,
data: [] as any[],
enableFiltering: true,
enablePaginationControls: false,
useExternalPagination: true,
minRowsToShow: 5,
useExternalSorting: true,
useExternalFiltering: true,
onRegisterApi: (gridApi: uiGrid.IGridApiOf<any>) => {
this.gridApi = gridApi;
this.gridApi.core.on.sortChanged(this.$scope, (grid: uiGrid.IGridInstanceOf<any>, columns: Array<uiGrid.IGridColumnOf<any>>) => this.sortRequests(grid, columns));
this.gridApi.pagination.on.paginationChanged(this.$scope, (newPage: number, pageSize: number) => this.changePage(newPage, pageSize));
this.gridApi.core.on.filterChanged(this.$scope, () => {
if (this.filterTimeout != undefined) {
this.$timeout.cancel(this.filterTimeout);
}
this.filterTimeout = this.$timeout(() => this.filterRequests(), 500);
});
},
I've set debuggers inside the filter methods but it doesn't get triggered by pressing enter only when you type a character.
Does anyone know what is triggering this button when enter is pressed?
UPDATE 1
<button class="btn btn-primary" ng-click="vm.open()" translate="country.headers.selectCountry"></button>
<div id="grid1" ui-grid="vm.gridOptions" ui-grid-pagination></div>
open() {
let instance = this.$uibModal.open({
templateUrl: 'app/common/controllers/html.html',
controller: 'controller as vm',
backdrop: 'static',
windowClass: 'country-modal',
resolve: {
programId: () => this.$stateParams['programId']
}
});
instance.result.then((dataGenerated: boolean) => {
if (dataGenerated) {
this.loadData();
}
});
}
UPDATE 2:
private filterRequests(): void {
let grid = this.gridApi.grid;
this.filtering = [];
for (let i = 0; i < grid.columns.length; i++) {
let column = grid.columns[i];
if (column.filters.length > 0) {
for (let j = 0; j < column.filters.length; j++) {
let filter = column.filters[j].term;
if (filter != undefined && filter != '')
this.filtering.push(column.field + '.contains("' + filter + '")');
}
}
}
this.loadRequests();
}
loadRequests(): void {
this.service
.get(
this.model.id,
{
params: {
page: this.pagingInfo.page,
pageSize: this.pagingInfo.pageSize,
sort: this.sorting,
filter: this.filtering
}
})
.then((data: any) => {
this.gridOptions.data = data.data;
this.gridHeight = (this.gridOptions.data.length + 2) * this.gridOptions.rowHeight;
this.pagingInfo.page = data.page;
this.pagingInfo.pageSize = data.pageSize;
this.pagingInfo.totalCount = data.totalCount;
});
}
With kinds regards, Brent