使用kendo网格与knockoutjs行模板使过滤不可能

我目前正在使用knockoutjs为MVVM模式和Kendo Web为控件构建一个应用程序。我有过滤/分组剑桥网格中的数据索姆河问题。使用kendo网格与knockoutjs行模板使过滤不可能

我需要有高度可定制的行，所以我选择使用的行模板，根据此样本：

http://rniemeyer.github.io/knockout-kendo/web/Grid.html

我还需要有一个双向与电网结合，因为我需要添加/删除/更新项目。

网格：

<div data-bind="kendoGrid: {  
    data: LienActionIndicateurPourFicheCollection, 
    widget: indicateurWidget, 
    rowTemplate: 'indicateurRowTmpl', 
    useKOTemplates: true, 
    dataSource : { 
     schema: { 
      model: { 
       fields: { 
        Code: { type: 'string' }, 
        Titre: { type: 'string' }, 
        Note: { type: 'number' }    
       } 
      } 
     }, 
    }, 
    columns: [    
     { title: '#', width: 30 }, 
     { field: 'Code', title: 'Code', width: 80 }, 
     { field: 'Titre', title: 'Titre', width: 150 }, 
     { field: 'Note', title: 'Note', width: 80 }] 
    }"> 
</div>

行模板：

<script id="indicateurRowTmpl" type="text/html"> 
    <tr"> 
     <td> 
      <button data-bind="visible: $root.isInEditMode, click: removeIndicateur" 
        class="common-button delete-button"></button> 
     </td> 
     <td data-bind='text: Code'></td> 
     <td data-bind='text: Titre'></td> 
     <td data-bind='text: Note'></td> 
    </tr> 
</script>

当我使用的网格，它工作正常，预计当我使用分组/过滤：它像电网使用可观察的物体而不是价值来执行操作。

实施例：当我分组上注'的整数值：由“字段：‘注意（）’”： enter image description here

为了防止这种情况，我已经在列定义替换“注“字段” ：现在分组工作正常，因为网格使用整数值而不是函数。

但是过滤仍然是不可能的：当我使'Note（）'发生变化时，列过滤器菜单已从数字过滤器更改为字符串过滤器。我想这是因为字段输入键'Note'与列输入键'Note（）'不匹配！

我试着在字段定义中用'Note（）'替换'Note'：不起作用。
我已经在我的项目模型中替换了可观察的可观察变量：所有工作都正常，但我无法再编辑这些值，我想要。

感谢您的帮助！

编辑：这里的jsfiddle刻板复制的bug：http://jsfiddle.net/camlaborde/htq45/1/

编辑＃2，这里的最终解决方案，这要归功于sroes：http://jsfiddle.net/camlaborde/htq45/7/

编辑＃3的最终解决方案，以及内嵌网格版：http://jsfiddle.net/camlaborde/8aR8T/4/

来源

2014-01-27 Camille Laborde

如果将'data：LienActionIndicateurPourFicheCollection'更改为'data：ko.toJS（LienActionIndicateurPourFicheCollection）'，该怎么办？ – sroes

我只是尝试过，但正如我所料，我正在失去网格和集合之间的绑定，如果我这样做（从集合中删除一行不更新网格）。 –

如果您创建一个计算结果作为普通的JS对象返回项目，它将起作用：

this.items.asJS = ko.computed(function() { 
    return ko.toJS(this.items()); 
}, this);

http://jsfiddle.net/htq45/2/

将ko.toJS(this.items)直接放在绑定中不起作用的原因是因为kendo追踪绑定中的单个选项的方式。 Knockout.js人RP尼迈耶教我：Dynamically enable/disable kendo datepicker with Knockout-Kendo.js

来源

2014-01-28 09:15:31 sroes

感谢您的回答！不幸的是，收集的更新仍然没有显示在网格中：尝试删除一个项目：http://jsfiddle.net/camlaborde/htq45/3/ –

我认为这是因为它的removeItem函数，'item'参数不再是可观察的...我想我已经找到了解决方法，并且很快会发布 –

好的！这里的解决方案：http://jsfiddle.net/camlaborde/htq45/4/！非常感谢:) –

我通过淘汰赛ES5解决了这个问题。然后，分配我的数据我的模型时，我用淘汰赛映射与这样的映射对象：

var dataMapper = { 
     create: function(o) { 
      return ko.track(o.data), o.data; 
     } 
    }; 
    ko.mapping.fromJS(json, dataMapper, self.data);

这使得过滤和排序工作了淘汰赛剑道网格盒子。

来源

2015-09-03 23:21:47 JoeWarwick

使用kendo网格与knockoutjs行模板使过滤不可能

回答

相关问题