我可以通过添加硬编码索引值来设置静态行或列索引,但如果用户想要选择列,我们如何使用knockout js来完成。目前我已经设置了静态列索引,但我希望用户能够选择要冻结的列。
var viewModel= function () {
var self = this;
self.data = ko.observableArray([]);
self.recordCount = ko.observable(0);
self.lowTotNoOfRec = ko.observable(0);
self.pageSize = ko.observable(10);
self.pageIndex = ko.observable(0);
self.paged = function (e, data) {
self.pageIndex(data.newPageIndex);
};
self.staticColumnIndex = -1;
}。
答案 0 :(得分:2)
假设您创建了一个自定义绑定处理程序来设置网格:
<table data-bind="wijgrid:gridConfig"></table>
您的gridConfig
包含staticColumnIndex
的观察点:
self.gridConfig = {
//...other configuration stuff...
staticColumnIndex: ko.observable(-1)
};
然后,自定义绑定处理程序的init
可以订阅staticColumnIndex
上的更改并更新网格的值:
ko.bindingHandlers.wijgrid = {
init: function (element, valueAccessor, allBindingsAccessor, data, context) {
var options = valueAccessor() || {};
var grid = $(element).wijgrid({
cellClicked: function (e, args) {
alert(args.cell.value());
},
allowPaging: true,
pageSize: options.pageSize(),
data: options.data(),
columns: options.headers,
scrollMode: "auto"
});
options.staticColumnIndex.subscribe(function (newValue) {
grid.wijgrid({
staticColumnIndex: newValue
});
});
}
};
演示:http://jsfiddle.net/pvo4mk3c/
PS:看起来一旦你在图表上有一个冻结列指示器,就可以来回拖动它。在我的演示中,观察者不会受到这些变化的影响。