|
export class AppComponent {
. . .
ngOnInit(): void {
this.data = new DataManager({ url: SERVICE_URI + 'api/Orders', adaptor: new WebApiAdaptor });
this.pageSettings = { pageCount: 3 };
this.dateMask = new MaskedTextBox({
width: 200,
created: ()=>{this.dateMask.value = null},
showClearButton: true,
cssClass: 'e-maskalign',
mask: '[0-3][0-9]/[0-1][0-9]/[0-3][0-9][0-9][0-9]',
});
this.numericBox = new NumericTextBox({
min: 0,
max: 20000,
showClearButton: true,
created: ()=>{this.numericBox.value = null},
format: '#',
cssClass: 'e-numericalign',
width: 210,
});
this.pageSettings = { pageCount: 5 };
this.filterSettings = { type: 'Excel' };
}
complete(args) {
if (args.requestType == 'filterafteropen') {
if (args.columnType === 'number' && args.filterModel && !args.filterModel.dlg.querySelector('.e-numericalign')) {
this.filterModel = args.filterModel;
args.filterModel.sInput.parentElement.remove();
var numericInputElement = document.createElement('INPUT');
args.filterModel.dlg.querySelector('.e-contextmenu-wrapper').appendChild(numericInputElement);
this.numericBox.appendTo(numericInputElement);
this.numericBox.element.classList.add('e-searchinput');
this.numericBox.element.onkeyup = () => this.filterModel.refreshCheckboxes();
this.numericBox.element.oninput = this.addFilterParamsOnKeyUp.bind(this, args); // binding oninput event for numericBox
args.filterModel.searchBox = this.numericBox.element.parentElement;
args.filterModel.sInput = this.numericBox.element;
}
if (args.columnType == 'date' && args.filterModel && !args.filterModel.dlg.querySelector('.e-maskedtextbox')) {
this.filterModel = args.filterModel;
args.filterModel.sInput.parentElement.remove();
var dateInputEle = document.createElement('INPUT');
args.filterModel.dlg.querySelector('.e-contextmenu-wrapper').appendChild(dateInputEle);
this.dateMask.appendTo(dateInputEle);
this.dateMask.element.classList.add('e-searchinput');
args.filterModel.searchBox = this.dateMask.element.parentElement;
args.filterModel.sInput = this.dateMask.element;
this.dateMask.change = (args) => {this.filterModel.refreshCheckboxes()};
this.dateMask.element.onkeyup = this.addFilterParamsOnKeyUp.bind(this, args); // binding onkeyup event for maskedBox
}
}
}
public addFilterParamsOnKeyUp(args, args2) {
this.grid.query.addParams("where" + args2.currentTarget.value, args2.currentTarget.value); //here you can add params as per your requirement
console.log(this.grid.query)
}
} | 
