Question

我在这个jsFiddle中有以下代码。

我遇到的问题是我的孩子物品没有正确更新。

我可以单击“编辑用户”出现问题，看到数据发生变化，但是当我尝试添加注释或者即使我要编写编辑注释功能时，数据也无法正确绑定

<ul data-bind="foreach: Users">
<li>
    <span data-bind="text: Name"></span>   
    <div data-bind="foreach: notes">
        <span data-bind="text: text"></span>
        <a href="#" data-bind="click: $parent.editNote">Edit Note</a>
    </div>
    <a href="#" data-bind="click: $parent.addNote">Add Note</a>
     <a href="#" data-bind="click: $parent.EditUser">Edit user</a>
</li>
</ul>

    <div id="userModal" data-bind="with: EditingUser" class="fade hjde modal">
        <div class="modal-header">
            <a class="close" data-dismiss="modal">×</a>
            <h3>
                Editing user</h3>
        </div>
        <div class="modal-body">
            <label>
                Name:</label>
            <input type="text" data-bind="value: Name, valueUpdate: 'afterkeydown'" />
        </div>
        <div class="modal-footer">
             <a href="#" class="btn btn-primary">Save changes</a>
        </div>
    </div>

<div id="addJobNoteModal" data-bind="with: detailedNote" class="fade hjde modal">
        <div class="modal-header">
            <a class="close" data-dismiss="modal">×</a>
            <h3>
                Editing Note</h3>
        </div>
        <div class="modal-body">
            <label>
                Text:</label>
            <input type="text" data-bind="value: text, valueUpdate: 'afterkeydown'" />
        </div>
        <div class="modal-footer">
             <a href="#" class="btn btn-primary" data-dismiss="modal">Save changes</a>
        </div>
    </div>




function Note(text) {
    this.text = text;
}

var User = function(name) {
    var self = this;
    self.Name = ko.observable(name);
    this.notes = ko.observableArray([]);
}

var ViewModel = function() {
    var self = this;
    self.Users = ko.observableArray();

    self.EditingUser = ko.observable();
    self.detailedNote = ko.observable();
    self.EditUser = function(user) {
        self.EditingUser(user);
        $("#userModal").modal("show");
    };


    this.addNote = function(user) {
        var note= new Note("original")
        self.detailedNote(note);
        $("#addJobNoteModal").find('.btn-warning').click(function() {
            user.notes.push(note);
            $(this).unbind('click');
        });

        $("#addJobNoteModal").modal("show");
    }

    for (var i = 1; i <= 10; i++) {
        self.Users.push(new User('User ' + i));
    }
}

ko.applyBindings(new ViewModel());

Answer 1

改变这个：

        $("#addJobNoteModal").find('.btn-warning').click(function() {

对此：

        $("#addJobNoteModal").find('.btn-primary').click(function() {

你的目标是错误的按钮：）

Answer 2

我认为问题毕竟是你必须在表格input / textarea中绑定到“value：”而不是“text：”。

knockout.js模态绑定值更新

2 个答案: