Question

我试图创建一个从JSON数据

创建CRUD表的淘汰表

我成功使用'添加'和'删除'但是如何处理'总计'和'内联编辑'

我的观点模型

function AppViewModel() {
    var self = this;
    self.koData = ko.observableArray(initialData);
    self.addLine = function () {
        self.koData.push({
            name: "",
            sales: "",
            price: ""
        });
    };
    self.removeLine = function () {
        self.koData.remove(this);
    }
}

内联编辑代码

$('td').on('click', function () {
    var l_coresHead = $(this).closest('table').find('th').eq(this.cellIndex).text();
    var inputField = "<input type='text' data-bind='value: " + l_coresHead + "'/>";
    var text = $(this).text();
    $(this).text('');
    $(inputField).appendTo($(this)).val(text).select().blur(function () {
        /* How to update the object koData */
    });
});

我需要一个显示所有价格总和的总计字段

此外，我正在尝试进行内联编辑。

在hutchonoid的帮助下，我完成了总和部分。现在我正在尝试进行内联编辑。欢迎任何帮助。

JSFiddle

Answer 1

以下是如何做到这一点：

将此添加到您的上一个表格行：

<td data-bind='text: total'>

然后计算它：

    self.total = ko.computed(function() {
        var tot = 0;
    for (var i = 0; i < self.koData().length; i++)  {
               tot += self.koData()[i]["price"]
    }
    return tot;
});

jsFiddle这里：

http://jsfiddle.net/879Pk/1/

这是一篇关于如何进行内联编辑的好文章，太长时间无法输入答案：

http://www.knockmeout.net/2011/03/quick-tip-dynamically-changing.html

带有内联编辑的Knockout CRUD表

1 个答案: