编辑对新添加的数据删除不起作用

Edit not working for newly added data - knockout

本文关键字:数据 删除 不起作用 添加 新添加 编辑      更新时间:2023-09-26

我一直在遵循一些教程,并试图遵循knockout.js。我无法编辑任何新添加的数据。

My JS Code:

var data = [
new ListData("Programmer", 1),
new ListData("Testing", 2),
new ListData("DBA", 3),
new ListData("Lead", 4),
new ListData("Manager", 5)
];

function ListData(desig, id) {
    return {
        Desig: ko.observable(desig),
        Id: ko.observable(id)
    };
}
var viewModel = {
    list: ko.observableArray(data),
    dataToAdd: ko.observable(""),
    selectedData: ko.observable(null),
    addTag: function () {
        this.list.push({ Desig: this.dataToAdd() });
        this.tagToAdd("");
    },
    selecData: function () {
        viewModel.selectedData(this);
    }
};
$(document).on("click", ".editData", function () {
});
ko.applyBindings(viewModel);

My View Code:

    <input type="text" data-bind="value:   dataToAdd" />
    <button data-bind="click: addData">
        + Add
    </button>
    <ul data-bind="foreach: list">
        <li data-bind="click: $parent.selecData">
            <span data-bind="text: Desig"></span>
            <div>
                <a href="#" class="editData">Edit</a> 
            </div>
        </li>
    </ul>
<div id="EditData" data-bind="with: selectedData">
    Designation:
    <input type="text" data-bind="value: Desig" />
</div>

我能够编辑已经存在的数据,如-程序员,测试,DBA…但是如果我添加一个新的数据…我不能编辑。请协助。

您的addData(您在代码中将其命名为addTag,但在HTML中调用addData)函数不以与初始数据创建相同的方式构建新元素。注意:由于ListData构造函数显式返回一个对象,所以new是多余的。

addData: function () {
    this.list.push(ListData(this.dataToAdd(), ""));
},