我通过将小部件绑定到可观察对象来启动剑道UI下拉列表。如果下拉列表中的valuePrimative
属性设置为 false,如何在进行选择后将值绑定"重置"为 null?
.HTML:
<select
data-role="dropdownlist"
data-text-field="name"
data-value-field="id"
data-option-label="Select to add..."
data-bind="source: rootData, value: selectedValue">
</select>
<button class='add-to-list-button k-button k-add' data-bind="click: add enabled: selectedValue">+</button>
观察:
this.widgetObservable = kendo.observable({
rootData: this.rootData,
selectedValue: null,
myList: [],
delete: (e) => {
this.deleteItem(e);
},
add: (e) => {
this.addItem(e);
}
});
重置下拉列表中的选定选项($('select', this.$container).data('kendoDropDownList').select(0)
确实会重置我的下拉列表,但它不会清除我的selectedValue
变量。
如果valuePrimitive
选项设置为 true,我可以将selectedValue
变量重置为-1
,这确实会重置变量并禁用我的按钮,但这意味着下拉列表返回的值将是原始的,迫使我在某个映射对象中寻找原始对象。
理想情况下,当我选择一个值并单击"添加"按钮时,我基本上想对选定的 OBJECT 执行操作,然后将下拉列表重置为其原始状态。
我已经看到如果我想清除选择,建议使用 Combobox 而不是下拉列表,因为下拉列表始终具有选定的值(这是有道理的(,但这引出了一个问题,初始加载后选择了什么(在任何选择之前(以及为什么我不能重置为该初始值?另外,我不想要组合框附带的额外功能。
我什至不应该为按钮上的enabled
绑定而烦恼吗?
你应该能够做到
delete: function(e) {
this.set('selectedValue', null);
}
如果您使用(e) => {}
语法,则不会是可观察的,因此请注意。
您的下拉列表应通过 MVVM 对此做出反应。