我正在使用拼接编辑记录后尝试更新表,但出现如下错误。性别是一个单选按钮。 我什至试图删除它,下一个字段显示错误。 我在这里做错了什么?
未捕获的引用错误: 无法分析绑定。绑定值:文本:性别信息:性别未定义
我看到一篇类似的帖子将新项目数组拼接到现有的 Knockout 可观察数组会导致绑定错误,但它似乎对我不起作用。
查看模型
var vmSearchResultsModel = function ()
{
var self = this;
self.SearchResults = ko.observableArray([]); //Holds the results of the search
}
返回到可观察数组的数据
"SearchResults": [
{
"id": 3,
"name": "Adrian D'Costa",
"dob": "/Date(-37776600000)/",
"gender": "M",
"joindate": "/Date(-37776600000)/" //<-- this is another issue I need to fix
},
{
"id": 14,
"name": "Janet D'Curz",
"dob": "/Date(-37776600000)/",
"gender": "F",
"joindate": "/Date(-37776600000)/"
}
]
拼接
var getjsondata = ko.toJSON(self.SearchResults, ['name', 'gender', 'dob', 'joindate']) // select only what is required to show
console.log(getjsondata);
var obj = JSON.parse(getjsondata); // convert JSON to JS string
alert(obj[0].gender); //M Male, F Female
self.SearchResults.splice(self.CurrentIndex, 1, obj); // updates the row that was edited <-- shows an error here
编辑时的单选按钮绑定
<td> Gender </td>
<td>
<input type="radio" id="rdMale" name="Gender" value='M' data-bind="checked: $root.gender" />
<input type="radio" id="rdFemale" name="Gender" value='F' data-bind="checked: $root.gender" />
</td>
编辑 1下面的模板显示了当我根据 DOB 搜索一些数据时,加入日期...
<script type="text/html" id="TmplSearchResults">
<tr style="border-bottom: 1px solid #CCC;">
<td valign="middle" data-bind="text: name"></td>
<td valign="middle" align="center" data-bind="text: gender"></td>
<!-- ko if: ($root.SearchByVal() ==="DOB") -->
<td valign="middle" data-bind="textualDate: dob"></td>
<!-- /ko -->
<!-- ko if: ($root.SearchByVal()==="Join Date") -->
<td valign="middle" data-bind="textualDate: joindate"></td>
<!-- /ko -->
<td valign="middle" > <img type="image" title="edit" src="images/edit1.png" data-bind="event:{ click: $root.EditEmpDetails.bind($data, $index())}" /></td>
</tr>
</script>
编辑 2
我像这样更改了代码
self.SearchResults().splice(self.CurrentIndex, 1, obj);
现在未捕获的引用错误:无法解析绑定。绑定值:文本:性别 消息:未定义性别错误不显示,但行不会随更改进行更新。 我错在哪里?
编辑 3
杰菲德尔 http://jsfiddle.net/7LYad/1/
更新
这个小提琴是没有任何错误的小提琴,但拼接没有发生,也没有观察到的可观察物得到更新。 我错在哪里。 我是否应该有两个视图模型,一个用于显示网格,一个用于保存,一个用于编辑、保存和拼接?
http://jsfiddle.net/7LYad/2/
你的问题与你的拼接无关:$root.gender
告诉 Knockout 查找一个名为 gender
的属性,该属性是 ViewModel 本身的属性(即您在 ko.applyBindings
中指定的属性(; $root
限定符始终是指虚拟机的顶层。显然,您的 VM 上没有此类属性;相反,它是 SearchResults
中对象的属性。
如果你有问题的HTML被包含在带有foreach: SearchResults
绑定的东西中(或者它位于使用foreach
或data
选项调用的模板中(,那么只需删除限定符并只写"gender"。
小提琴后更新
1( 您永远不会将主视图模型中的EditEmployee
设置为 true 值,因此用于编辑员工的字段将永远不会显示。
2(在SaveEmpDetails
中,您尝试将对象的JSON字符串表示形式(而不是对象本身(拼接到SearchResults
中。
http://jsfiddle.net/7LYad/5/
当你拼接一个挖空可观察数组时,你不想拼接数组的值,而是想拼接底层数组本身。 确保在尝试更改值时不要"获取"observableArray 的值,除非您计划将其设置为其他值 -
self.SearchResults.splice(self.CurrentIndex, 1, getjsondata);
其他可能的方式 -
self.otherArray = self.SearchResults().splice(self.CurrentIndex, 1, getjsondata);