我有一个可观察的数组“用户”,它在显示时基本上就是一个网格。用户将单击LoginId的链接,该链接将打开模型以编辑单个用户(名字,姓氏,以及不在网格视图上的更多内容等)。如果用户在编辑模式上更改了FirstName,我希望它在成功保存后反映在网格上。我已经看到了两种方法:使用arrayFirst查找并删除/重新添加用户到网格或使可观察数组中的每个项目都可观察。我不确定什么是让它工作的最佳方法以及如何正确设置observable数组observable,如果这是最好的方法。
function UserViewModel() {
var self = this;
//data which is populated on a load AJAX function => self.users(msg.d);
self.users = ko.observableArray([]);
self.updateUser = function () {
//set edit modal elements
self.editFirstName(this.FirstName);
//set the rest for edit
//open modal, user edits 'editFirstName' and hits save
//data saved to DB
//now I want to update the FirstName the user edited in the users array so I don't have to repull all users in the grid
}
}
HTML片段
<tbody data-bind="foreach: users">
<tr>
<td class="border-left"><a href="#" data-bind="text: LoginId,click: $parent.updateUser"/></td>
<td data-bind="text: FirstName"/>
<td data-bind="text: LastName"/>
<td data-bind="text: EmailAddress"/>
<td data-bind="text: AccessLevel"/>
<td data-bind="text: Status" class="border-right" />
</tr>
</tbody>
答案 0 :(得分:3)
如果希望在更改值时更新表,则表绑定的属性必须为observables
。你没有发布你的User
课程,所以我不知道是不是这样,但看起来应该是这样的:
var Person = function(data) {
var self = this;
self.loginId = data.loginId;
self.firstName = ko.observable(data.firstName);
self.lastName = ko.observable(data.lastName);
self.emailAddress = ko.observable(data.emailAddress);
self.accessLevel = ko.observable(data.accessLevel);
self.status = ko.observable(data.status);
};
更改这些值时,表格应该更新。在this fiddle
中查看