Сетка jqx и вычисляемый столбец нокаута

Я хотел бы иметь простой jqxGrid с вычисляемым столбцом. Вроде все ок, но не работает. Простой пример:

<script type="text/javascript">
$(document).ready(function () {
    var vm = {
        date: ko.observable(new Date()),
        items: ko.observableArray(),
        load: function () {
            for (var i = 0; i < 10; i++) {
                var item = {
                    x: ko.observable(i),
                    y: ko.observable(i + 1)
                };
                item.sum = ko.computed(function() { return this.x() + this.y(); }, item);
                this.items.push(item);
            }
        }
    };
    ko.applyBindings(vm);
});
</script>

<input data-bind="click: load, jqxButton: {theme: 'metro'}" type="button" value="Load" />
<div data-bind="jqxGrid: {source: items, disabled: false, autoheight: true,
                editable: true,
                selectionmode: 'singlecell',
                theme: 'metro',
                columns: [
                { text: 'X', dataField: 'x' },
                { text: 'Y', dataField: 'y' },
                { text: 'Sum', dataField: 'sum'}
                ]}" id="jqxgrid">
</div>
<table style="margin-top: 20px;">
<tbody data-bind="foreach: items">
    <tr>
        <td data-bind="text: x"></td>
        <td data-bind="text: y"></td>
        <td data-bind="text: sum"></td>
    </tr>
</tbody>
</table>

Это происходит: я могу обновить x или y и вижу новые значения в таблице ниже, но поле Sum никогда не обновляется после первой загрузки.


computed-observable knockout.js jqxgrid
person Yan Oreshchenkov    schedule 03.12.2012    source источник
comment
Можете ли вы опубликовать исходный код нокаутирующей привязки jqxGrid? Я вижу, вы используете пользовательскую нокаутирующую привязку, и она, вероятно, отвечает за подключение подписок. Проблема скорее всего в этом коде.   -  person Judah Gabriel Himango    schedule 03.12.2012

Ответы (1)


arrow_upward
0
arrow_downward

Ваше свойство .sum является вычисляемым значением, но jqxgrid не имеет ни малейшего представления о вычислениях или других наблюдаемых значениях. Поэтому он понятия не имеет, что ему нужно обновиться.

Вы можете инициировать обновление самостоятельно, подписавшись на вычисление и вызвав .updatebounddata в сетке:

vm.sum.subscribe(function() {
    $('#idOfYourGridHere').trigger( 'updatebounddata' );
}

Я вижу, вы используете пользовательскую нокаутирующую привязку под названием jqxgrid. Если хотите, вы, вероятно, могли бы изменить эту привязку, чтобы она обновлялась правильно.

person Judah Gabriel Himango    schedule 03.12.2012
comment
Да, это похоже на решение, но, к сожалению, привязка jqx работает довольно медленно, чтобы использовать ее каждый раз, когда что-то меняется. Не могу отделаться от мысли, что внутри сетки jqx что-то не так. Взгляните на пример. Если вы измените привязку нижней таблицы, чтобы привязать значения внутри ‹input type=text/›, вы сможете легко их редактировать. И если вы измените X или Y, сумма будет автоматически рассчитана и обновлена ​​​​в таблице и в сетке (!). Почему это не работает, когда я редактирую одно и то же значение в сетке, это чудо. Сетка обновляет его в модели представления, но делает это неправильно, что не пересчитывает сумму - person Yan Oreshchenkov; 12.12.2012
comment
@YanOreshedkov Пожалуйста, опубликуйте код обработчика привязки нокаута jqxGrid. - person Judah Gabriel Himango; 12.12.2012