如何清除/重置仅使用 javascript 的剑道下拉列表

How do I clear / reset a Kendo DropDownList with only javascript?

本文关键字：javascript 下拉列表 何清除 清除      更新时间：2023-09-26

我有一个包含 3 个选项的 Kendo DropDownList （name=Function）。选择一个选项时，它会触发 ajax 调用以获取数据以填充不同的 DropDownList（名称 = Parent）。这按预期工作。但是，如果用户随后将原始的DropDownList"功能"更改回其他选择，我需要清除/重置（删除所有选项）并禁用"父母"下拉列表。

function LoadKendoDropdownContents(dropdownBoxId, data) {
  var dropdownBox = $("#" + dropdownBoxId).data("kendoDropDownList");
  if (data === "" || data === null || $.isEmptyObject(data)) {
    var dataSource = [];
  }
  else {    
    var dataSource = data;
  }
  dropdownBox.setDataSource(dataSource);
}

这真的是"var 数据源 = []"给我带来了问题。就像应用"父项"下拉列表时不会刷新/重新绑定一样。除所选选项外的所有选项都将被删除，但如何删除之前选择的选项？我希望它再次"空"。

谢谢。

---- 我----使用的解决方案

function LoadKendoDropdownContents(dropdownBoxId, data) {
  var dropdownBox = $("#" + dropdownBoxId).data("kendoDropDownList");
  if (data === "" || data === null || $.isEmptyObject(data)) {
    var dataSource = new kendo.data.DataSource({
      data: []
    });
    dropdownBox.text(" --- ");
    dropdownBox.value(-1);
  }
  else {
    var dataSource = new kendo.data.DataSource({
      data: data
    });
    dropdownBox.text("[Select]");
    dropdownBox.value(-1);
  }
  dropdownBox.setDataSource(dataSource);
}

使用级联下拉功能可能更容易。

更改数据源时，它会删除下拉项，但您还需要通过调用以下命令清除所选文本并禁用该框：

dropdownBox.setDataSource(dataSource);
dropdownBox.text('');
dropdownBox.enable(false);

如果已为父项和子项下拉列表定义了数据源，则可以在子项中使用 cascadeFrom（'parent'） 方法，并设置一个可以标识为 null 或清除的值。

相关文章：