使用 jQuery val() 更新 KnockoutJS 绑定的文本框答案

【问题标题】：Update KnockoutJS bound textbox with jQuery val()使用 jQuery val() 更新 KnockoutJS 绑定的文本框
【发布时间】：2013-05-04 07:59:04
【问题描述】：

所以我在单页应用程序中使用带有KO Mapping Plugin 的 KnockoutJS，一切都很好......除了......

引用站点可以选择在查询字符串中发送一些值来预填充几个文本框。我有一个解析查询字符串并使用 jQuery val() 填充 KO 绑定文本框值的 JS 函数。但是，该值永远不会被设置。

这是我正在尝试的一些伪代码...

var jobTitle = "Ninja";

$("#jobTitle").val(jobTitle); // doesn't work

$("#jobTitle").val(jobTitle).change(); // doesn't work

$("#hiddenJobTitle").val(jobTitle); // works

标记

<input id="jobTitle" type="text" data-bind="value: JobTitle" />

<input id="hiddenJobTitle" type="hidden" data-bind="value: JobTitle" />

一个有趣的提示：我使用相同的代码来设置 KO 绑定隐藏字段的值，它工作正常。

【问题讨论】：

只是好奇你不能只使用ko.observable() 语法来设置值吗？可能只是val() 与 ko 内部关系的问题。只是一个想法。
我尝试将视图模型上的属性设置为计算的可观察对象，以检查查询字符串值，但这也不起作用。但这可能是如何使用 KO 映射设置的问题
另外值得注意的是..如果我从 html 标记中取出数据绑定语法，则值会正确设置。所以这绝对是淘汰赛中的事情，而不是我对价值的获取/设置。
安迪，你能再贴一些代码吗，也许是你的视图模型？或者，生成一个 jsfiddle 重现您的问题？
@AndyBrudtkuhl 好吧，我做了一个非常基本的小提琴，见jsfiddle.net/UAjY2 问题是......它有效。

标签： jquery knockout.js knockout-mapping-plugin

【解决方案1】：

它对$("#jobTitle").val(jobTitle)不起作用的原因是因为jobTitle敲除数据绑定实际上是函数。如果您要在代码中检查该点并查看返回的职位名称，您会发现它是一个函数。你需要使用$("#jobTitle").val(jobTitle());

为了获得淘汰赛价值的回报。

【讨论】：

jobTitle 只是我从查询字符串值设置的字符串变量
我假设在你的真实情况下它不会是一个字符串，因为你说上面是伪代码。如果它是作为一个 KO 对象出现或被分配给一个 KO 对象，那么上述仍然成立。

【解决方案2】：

这不是 KnockoutJS 的问题，而是我加载脚本和调用函数的顺序。

我正在通过文档准备好的查询字符串设置文本框的值 - 在 KO 绑定到的视图模型被实例化之前。

所以我从 parse / set 脚本中创建了一个新函数，并在创建视图模型并将其绑定到 KO 后调用它。

理想情况下，我会编写一个事件处理程序/回调来监视淘汰赛绑定以运行它 - 但无法找到淘汰赛是否支持这样的事件回调。如果他们这样做 - 请告诉我。

理想情况下我想做这样的事情，所以顺序无关紧要

ko.on("bind", function(viewModel) {
 // this runs after knockout binds a view model
});

【讨论】：