当用户修改或编辑 jqxGrid 中的行时,如何防止更改 observableArray 中的对象的这种行为。我有一个淘汰的可观察用户数组,其中每个用户都有所有属性作为可观察对象,然后我将该可观察数组绑定到 jqxGrid(来自 jqWidgets)。当我在网格中更新用户值时,在可观察数组中,该项目被替换为包含该用户的可观察值的对象。
下面是我的代码:
HTML 部分:
<div class="container">
<div id="jqxGrid"
data-bind="jqxGrid: {
source: Users,
editable: true,
width: '100%',
selectionmode: 'singlecell',
columns: [
{ text: 'IsChecked', columntype: 'checkbox', dataField: 'IsChecked', width: '10%' },
{ text: 'FirstName', dataField: 'FirstName', width: '40%', editable: false, sortable: true },
{ text: 'LastName', dataField: 'LastName', width: '40%', editable: true, sortable: true }
]
}">
</div>
</div>
Javascript 代码:(创建用户数组,ViewModel 初始化,ko.applyBindings 调用。)
function UserModel (user) {
var self = this;
self.IsChecked = ko.observable(false); // later I will use this proerty in other place
self.Username = ko.observable(user.Username);
self.FirstName = ko.observable(user.FirstName);
self.LastName = ko.observable(user.LastName);
// I want to put a isDirty property here
}
var initialUsers = [
new UserModel({ Username: 'JohnMicrosoft', FirstName: 'John', LastName: 'Microsoft' }),
new UserModel({ Username: 'JohnGoogle', FirstName: 'John', LastName: 'Google' }),
new UserModel({ Username: 'JohnApple', FirstName: 'John', LastName: 'Apple' }),
];
var viewModel = null;
$(document).ready(function () {
viewModel = new UserViewModel(initialUsers);
ko.applyBindings(viewModel);
});
function UserViewModel(initialUsers) {
var self = this;
self.Users = ko.observableArray(initialUsers);
};
此图像显示了在我单击 IsChecked 复选框的第一行后值如何变化。
在 jqxGrid 中单击第一行的 IsChecked 复选框的结果
问题是我想向 UserModel 对象添加一些函数,并且我想保留 observables,因为我想在页面的其他部分使用它们。我已经在这方面工作了好几天,不知道该怎么做任何帮助将不胜感激。谢谢。