如何更新knockoutjs可观察数组项

时间:2012-09-26 20:10:31

标签: javascript knockout.js

我有一个带有可观察用户对象数组的视图模型设置。项目的添加/删除工作正常,但如何更新项目?我可以使用ko indexOf函数找到值。

function User( username, date_inactive, date_active ) {
    this.username = username;
    this.date_active = date_active;
    this.date_inactive = date_inactive;
};  

User.prototype.inactivateMe = function() {
    json_responses.push( this );
    $.getJSON( "url" + this.username, function( json ) {
        original = json_response.pop();
        //do update here
    });
};

userModel = [  ], //Where the loaded usernames are stored. 

viewUserModel = {
    users: ko.observableArray(userModel)
    //.......

    //This is how I'm adding users to the array.
addUser: function () {
    $.getJSON( "url", 
    { username: usern }, 
        function( json ) { 
            if( json.STATUS != undefined && json.STATUS == 'success' ) {
                newuser = new User( json.USERNAME, json.DATE_ACTIVE, json.DATE_INACTIVE  );
                viewUserModel.users.push( newuser );            
            }
        }
    });
    }

viewUserModel.users的值从服务器json响应中推送到数组中。

我希望能够在用户单击按钮时更新date_active和date_inactive值,并且服务器响应成功。

我的设置是http://net.tutsplus.com/tutorials/javascript-ajax/into-the-ring-with-knockout-js-the-title-fight/

的改编

1 个答案:

答案 0 :(得分:2)

可观察数组仅跟踪对数组所做的更改(例如推送和弹出),而不是数据本身。您需要在@Ianzz指定的情况下制作date-activedate_inactive个可观察对象。

function User( username, date_inactive, date_active ) {
    this.username = username;
    this.date_active = ko.observable(date_active);
    this.date_inactive = ko.observable(date_inactive);
};

之后在你的HTML中,做一些像

这样的事情
<div data-bind="foreach: Users">
    <input data-bind="value: date_active"/>
    <input data-bind="value: date_inactive"/>
<div>​

有关完整示例,请参阅fiddle