Using Kendo Grid with knockoutjs row pattern makes filtering impossible

Question

I am currently creating an application using knockoutjs for the MVVM template and Kendo Web for the controls. I have problems filtering / grouping data in a kendo grid.

I need to have custom strings, so I select a string pattern according to this example:

http://rniemeyer.imtqy.com/knockout-kendo/web/Grid.html

I also need to have two-way mesh binding, because I need to add / remove / update elements.

Grid:

<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>

String Pattern:

<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>

When I use the grid, it works fine, expect me to use grouping / filtering: it, like the grid, uses the objet observable object instead of the value to perform operations.

: "" :

, ":" " :" () ": , .

: , 'Note(). , , "" "()"!

• "" "()" : .
• Note, , : , , .

!

EDIT: jsfiddle : http://jsfiddle.net/camlaborde/htq45/1/

№ 2 , sroes: http://jsfiddle.net/camlaborde/htq45/7/

EDIT № 3 : http://jsfiddle.net/camlaborde/8aR8T/4/

Answer 1

, , 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 man RP Niemeyer : / datepicker Knockout-Kendo.js

Answer 2

, Knockout ES5. , , :

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

.