Question

问题是我无法更新新创建的项目，因为在服务器上我没有收到任何ID。

我正在尝试学习Knockout，但我无法找到向新创建的项目提供Id的方法。

我有一个带有Id和Name的对象，使用knockout我可以进行所有Crud操作，但是，在插入一个新项目之后，如果我尝试更改他的名字，我不能，因为该项目没有Id值。

我的问题是：每次添加新项目时，我都需要将新的项目集合返回到视图中，然后重新绑定视图？

或者，有另一种方法可以为新插入的项目提供ID吗？

这是我的代码：

function Person(id, name) {
    var self = this;
    self.Id = ko.observable(id);
    self.nume = ko.observable(name);


}

function PersonVm() {
    var self = this;



self.Persons = ko.observableArray([]);


self.newPerson = ko.observable(new Person())
self.isModificare = false;

self.addPerson = function () {

    if (!self.isModificare) {
        $.ajax("/Person/AddPerson", {
            data: ko.toJSON({ Person: self.newPerson }),
            type: "post", contentType: "application/json",
            success: function (result) { alert(result.mesaj); }
        });
    } else {
        $.ajax("/Person/UpdatePerson", {
            data: ko.toJSON({ Person: self.newPerson }),
            type: "post", contentType: "application/json",
            success: function (result) { alert(result) }
        });
    }
    self.isModificare = false;


    if (!self.isModificare) self.Persons.unshift(self.newPerson());
    self.newPerson(new Person());


}
self.removePerson = function () {
    $.ajax("/Person/DeletePerson", {
        data: ko.toJSON({ Person: self.newPerson }),
        type: "post", contentType: "application/json",
        success: function (result) { alert(result) }
    });
    self.Persons.remove(self.newPerson());
    self.newPerson(new Person());


}

self.ModificaPerson = function (person) {        
    self.newPerson(person);
    self.isModificare = true;

}

$.getJSON("/Person/GetPersons", function (allData) {
    var mapPerson = $.map(allData, function (item) { return new Person(item.Id,item.Name) });
    self.Persons(mapPerson);
});
}

ko.applyBindings(new PersonVm());

修改

这是观点：

 <div class="input-group">

        <input type="text" class="form-control" data-bind="value: newPerson().name">
        <span class="input-group-btn">
            <button class="btn btn-default" data-bind="click:addPerson">
               <span class="glyphicon glyphicon-plus-sign" style="color:green"></span>
            </button>
        </span>
        <span class="input-group-btn">
            <button class="btn btn-default" data-bind="click:$root.removePerson">
                <span class="glyphicon glyphicon-trash" style="color:red"></span>
            </button>
        </span>
    </div>



 <ul data-bind="foreach: Perons" class="list-group" id="content">
    <li class="list-group-item"  data-bind="text: name,click:$root.ModificaPerson"></li>
</ul>

Answer 1

获得所需内容的两个步骤：

确保您的“Person / AddPerson”Web服务返回已创建对象的ID。

更改您的更新方法，以便在newPerson属性上设置ID：

$.ajax("/Person/AddPerson", {
    data: ko.toJSON({ Person: self.newPerson }),
    type: "post", contentType: "application/json",
    success: function (result) {
        self.newPerson().Id(result.Id);
    }
});

请注意，上面的代码假设您的服务返回一个名为“Id”的ID属性的JSON对象。

如何使用Knockout设置新创建项的id

1 个答案: