时间戳

首页 > 解决方案 > Knockout JS 如何将数据绑定到静态表单元素

javascript - Knockout JS 如何将数据绑定到静态表单元素

问题描述

我正在尝试在 knockout.js 中对表单元素进行数据绑定。但是我不希望元素在表单中是可编辑的，甚至不希望将元素显示给用户。

我能够正确地将值绑定到输入元素。但如果我可以从 HTML 或标签文本或跨度中提取值，我会更喜欢。所以下面的工作，但我无法改变它，所以它不是用户可以改变的输入。

<input id="txtProvider" name="txtProvider" type="text" data-bind="value: $root.session().Resource().provider" />

我尝试只使用带有占位符的隐藏元素，但这不起作用。

<input id="txtProvider" name="txtProvider" type="hidden" placeholder="WebEx" data-bind="value: $root.session().Resource().provider" />

有什么建议么？

在此先感谢您的帮助。

标签： javascriptknockout.jsknockout-mvc

解决方案

你正在做的工作，或者应该工作，很好：

<form>
  <input type="hidden" data-bind="value: myHiddenVal" />
</form>

function ViewModel() {
  self.myHiddenVal = ko.observable('Foo');
}

ko.applyBindings(new ViewModel());

这将产生：

<input type="hidden" data-bind="value: myHiddenVal" value="Foo">

示例：https ://jsfiddle.net/thebluenile/myves32x/

虽然我不得不说，我当然不知道您的确切用例，但“从 HTML 元素中提取值”与 Knockout 或任何其他数据绑定框架的工作方式有点对立。如果用户不必编辑该字段，您可以将其完全保留在 UI 之外。我能想到的隐藏元素的唯一有效用例是，如果您将表单提交到服务器端脚本进行处理，而不是通过 AJAX 发送其内容。

推荐阅读