javascript - Knockout js 隐藏了我的 html 代码

标签 javascript html knockout.js

所以,当用户选择我需要在输入中显示一些数据并且它有效时,我已经完成了“选择选项”,但只有当我从选择中选择任何值时,它才会显示我的输入,但我需要始终显示我的输入,因为我需要这是另一个操作的输入

这是我的选择。

 <select size="2" style="height: 200px;width: 200px" class="selection 
    data-bind="options:solutions, optionsText:'name',value:selectedSolutions"></select>

这是我必须始终显示的输入,它们仅当我从上面的选择中选择参数时才显示

<form class="col-md-5" data-bind="with: selectedSolutions" style="margin-left:128px;">
      <div class="form-group">
        <label for="inputsm">Solution Name:</label>
        <input class="form-control input-sm" data-bind="value:name" id="inputsm" type="text">
      </div>
      <div class="form-group">
        <label for="inputdefault">Brief description:</label>
        <input class="form-control " style="height: 100px" data-bind="value:briefDescription" id="inputdefault" type="text">
      </div>
      <div class="form-group">
        <label for="url">Read more:</label>
        <input class="form-control input-lg" data-bind="value:readMore" style="height:150px" data-bind="value:" id="url" type="text">
      </div>
      <div class="form-group">
        <label for="inputlg">Solution manufacture URl:</label>
        <input class="form-control input-sm" id="inputlg" data-bind="value:manufactureUrl" type="text">
      </div>
    </form>

感谢您的帮助,对英语表示抱歉。

最佳答案

由于您使用 with 绑定(bind),因此 form 标记内的任何内容都不会显示,除非 selectedSolutions 不为 null。

我猜在您的 ViewModel 中,您正在初始化 selectedSolutions 属性,如下所示 viewModel.selectedSolutions = ko.observable();

因此,您必须为 selectedSolutions 设置默认值,以确保始终显示 form 标记内的所有内容。如下所示:

viewModel.selectedSolutions = ko.observable({
    name: "", // you could put any default value you want here, not just blank
    briefDescription: "",
    readMore: "",
    manufactureUrl: ""
});

关于javascript - Knockout js 隐藏了我的 html 代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46878899/

相关文章:

javascript - 以循环顺序显示多个信息 JQuery - Flapper

javascript - 防止通过检查元素下载html5视频

html - 选择元素文本在我的自定义箭头上运行

knockout.js - 在运行时将可观察量添加到模型中。但 ko.mapping.toJS 不会返回它们

javascript - 自定义绑定(bind)在 KnockoutJS 3.0 中不再有效

javascript - React Native 可以用来构建我的蓝牙应用程序吗?

javascript - Lodash 比较/合并对象与数组

javascript - 是或否而不是 knockout 中的真或假

javascript - 使用javascript重定向html页面

html - 如何根据YAML front matter设置背景颜色(Jekyll)