在 Kendo UI 下拉列表中使用值绑定时,将 Onservable 重置为 null



我通过将小部件绑定到可观察对象来启动剑道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 对此做出反应。

最新更新