createdControl() {
if (Browser.isDevice) {
this.qbObj.summaryView = true;
}
this.bindEvent();
}
// bind filtering event for dropdownlist
bindEvent(){
let ddlColl = document.querySelectorAll('.e-dropdownlist');
for (let i = 0; i < ddlColl.length; i++) {
let ddl = getComponent(ddlColl[i], "dropdownlist");
ddl.index = -1;
ddl.dataBind();
if(ddlColl[i].id.indexOf("operatorkey") < 0){
ddl.filtering = this.onFiltering;
ddl.allowFiltering = true;
}
}
}
onChange(args) {
if(args.type ==="insertRule")
this.bindEvent();
}
onFiltering(e) {
let query = new Query();
//frame the query based on search string with filter type.
let qryBldrObj =getComponent(document.querySelector('#querybuilder'), 'query-builder');
query = (e.text !== '') ? query.where('label', 'startswith', e.text, true) : query;
//pass the filter data source, filter query to updateData method.
e.updateData(qryBldrObj.columns , query);
}
<QueryBuilderComponent id='querybuilder' width='70%' dataSource={employeeData} columns={this.columnData} created={this.createdControl.bind(this)} change={this.onChange.bind(this)} ref={(scope) => { this.qbObj = scope; }}>
</QueryBuilderComponent> |