我想在剑道网格上的过滤器中设置用户定义的搜索值.用户打开过滤器后,该值将被放入搜索框中.任何建议将不胜感激.
这是类似的问题到Set default filter for Kendo UI Grid,除了我使用角度js,我想要一个用户定义的字符串过滤器值：
这就是我构建网格的方式.我正在使用角度js来创建具有自定义属性的div.最值得注意的属性是sg-grid(剑道网格本身),sg-filterable(设置为true表示此网格应该是可过滤的)和sg-predefine-filter(也设置为true表示此网格的过滤器应该具有打开时输入搜索框的字符串)：
>标记
<div sg-grid sg-data="api/grid/accounts" sg-columns="accountId,name,pricingFrequency,shortName,status" sg-filterable="true" sg-predefine-filter-value="true" </div>
>脚本(在此简化为演示)
angular.module('sgComponents').directive('sgGrid',[
return {
restrict: 'AE',scope: { filterable: @sgFilterable,predefineFilterValue: @sgPredefineFilterValue},template: '<div class="sg-grid">\
<div class="pager-bar">\
<div></div>\ // THE KENDO GRID
</div>\
</div>',link: function(scope,element,attrs) {
buildGrid();
function buildGrid() {
var grid = element.find(':nth-child(2)'); // 2nd DIV IN THE TEMPLATE
var gridOptions = buildGridOptions(scope,attrs,grid);
grid.kendoGrid(gridOptions); // build the grid
};
/**
Builds the options for the grid
*/
function buildGridOptions(scope,grid) {
if (scope.filterable === 'true') {
opts.filterable = {};
opts.filterable.operators = {};
opts.filterable.operators.string = {}
if (scope.predefineFilterValue === 'true') { // set a pre-defined value if true
opts.filterable.operators.string = {
eq: 'Is equal to',value:'Test'
}
} else { // just show the filter option
opts.filterable.operators.string = {
eq: 'Is equal to'
}
}
}
}
}
};
]);
>以下是控制台日志的图像：
结果.如您所见,我的值被添加为另一个过滤器选项.我不想要这个,我希望它作为一个值在输入框中！
终于找到了一个让我朝着正确方向前进的
kendo forum question！
解决方案不是在构建网格时添加预设过滤器值,而是在网格使用kendoGrid.dataSource.filter对象完成构建后执行此操作：
angular.module('sgComponents').directive('sgGrid',template: '<div class="sg-grid">\
<div class="pager-bar">\
<div></div>\ // THE KENDO GRID
</div>\
</div>',attrs) {
buildGrid();
function buildGrid() {
//code same as in original question
grid.kendoGrid(gridOptions); // build the grid
};
/*
* Builds the options for the grid
*/
function buildGridOptions(scope,grid) {
//code same as in original question
}
/*
* the grid has finished building so
* now get hold of it and pre-set the
* filter value.
* The values (the field to filter,the type of filter and the value)
* are hard-coded here but ultimately would
* come from a JSON object on the scope,constructed
* using values from the model
*/
kendoGrid = gridElem.data('kendoGrid'); // the grid
//If the attribute to pre-set a filter value is true...
if (scope.predefineFilterValue === 'true') {
var ds = kendoGrid.dataSource; // the datasource object has a filter object
ds.filter([
{
"logic":"or",// could be 'and'
"filters":[{
"field":"accountId",// the column you want to filter
"operator":"eq",// the type of filter
"value":105 // the value,hard-coded for testing
}]
}
}
}
}
]);
