Question

我正在使用Kendo-knockout框架。我在过滤网格中的日期列时遇到问题。过滤日期始终返回0结果。我注意到传统的剑道网格将具有以下过滤器选项：等于，不等于，是等于，等于，是等于，是等于，等于之前。但是，我的kendo-knockout网格对日期列使用以下过滤器选项：等于，不等于，开始于，包含，不包含，结束。

看起来kendo认为日期列是一个字符串列，这就是我的网格中字符串列和日期列的过滤器选项相同的原因。

以下是我的代码。注意在failedTradeModel中，我订阅了每个字段以便进行排序和过滤工作。这解决了以前的问题，即kendo-knockout网格在没有进行此订阅的情况下根本不会排序或过滤（我在这里看到了这个解决方案：Kendo UI and knockout.js rowTemplate sorting）。

价格列对此进行排序和过滤，这只是具有上述问题的TradeDate列。

任何帮助？

编辑：对于任何有兴趣的人，我已经发布了以下工作解决方案的答案。诀窍是为failesGridConfig对象中的日期列添加'type：“data”'。我还必须将self.TradeDateSort设置为failedTradeModel函数中的日期对象。

var ViewModel = function () {
var self = this;  
self.failedTradesAry = ko.observableArray();

self.initializePage = function () {
    $.getJSON(initalizeFailedTradesPageUrl, null, function (data) {
        dataReturned = data.FailedTrades;

        self.failedTradesAry(ko.utils.arrayMap(dataReturned, function (item) {
            var g = new failedTradeModel(self);
            ko.mapping.fromJS(item, {}, g);
            return g;
        }));
    });
};


self.failesGridConfig = {
    data: self.failedTradesAry,
    sortable: true,
    filterable: true,
    rowTemplate: 'rowTmpl',
    useKOTemplates: true,
    columns: [
        { 
            field: 'TradeDateSort', 
            title: 'Trade Date', 
            width: 100,
            filterable: {
                ui: "datepicker"
            }
        },
        { 
            field: 'PriceSort', 
            title: 'Price', 
            width: 100 
        }
      ]
    };
};

var failedTradeModel = function (parentVm, data) {
    var self = this;

    self.TradeDateSort;
    self.TradeDate = ko.observable();
    self.TradeDate.subscribe(function (value) {
        self.TradeDateSort = value;
    });

    self.PriceSort;
    self.Price = ko.observable();
    self.Price.subscribe(function (value) {
        self.PriceSort = value;
    });

    return self;
};

Answer 1

var ViewModel = function () {
var self = this;  
self.failedTradesAry = ko.observableArray();

self.initializePage = function () {
    $.getJSON(initalizeFailedTradesPageUrl, null, function (data) {
        dataReturned = data.FailedTrades;

        self.failedTradesAry(ko.utils.arrayMap(dataReturned, function (item) {
            var g = new failedTradeModel(self);
            ko.mapping.fromJS(item, {}, g);
            return g;
        }));
    });
};


self.failesGridConfig = {
    data: self.failedTradesAry,
    sortable: true,
    filterable: true,
    rowTemplate: 'rowTmpl',
    useKOTemplates: true,
    columns: [
        { 
            field: 'TradeDateSort', 
            title: 'Trade Date', 
            width: 100,
            filterable: {
                ui: "datepicker"
            },
            type: "date" 
        },
        { 
            field: 'PriceSort', 
            title: 'Price', 
            width: 100 
        }
      ]
};
};

var failedTradeModel = function (parentVm, data) {
var self = this;

self.TradeDateSort;
self.TradeDate = ko.observable();
self.TradeDate.subscribe(function (value) {
    var dt = new Date(value);
    self.TradeDateSort = dt;
});

self.PriceSort;
self.Price = ko.observable();
self.Price.subscribe(function (value) {
    self.PriceSort = value;
});

return self;
};

Kendo-knockout网格不会过滤日期列

1 个答案: