Kendo 下拉列表：设置不是来自下拉列表的初始值

Question

我正在使用 Icon 实现一个下拉列表。与此类似https://demos.telerik.com/aspnet-mvc/dropdownlist/template

this.createDropdownList('iconField', this._services.getNames,
    {
        valueTemplate: function (dataItem) {
            return '<span style="background-image: url(\'' + "/Style/Images/" + fileName + '\');' + "vertical-align: middle;display: inline-block;width: 24px;height: 24px;background-size: 100%" + '"></span>' +
                '<span>' + dataItem.name+ '</span>';

        },
        template: function (dataItem) {
            return '<span style="background-image: url(\'' + "/Style/Images/" + fileName + '\');' + "vertical-align: middle;display: inline-block;width: 32px;height: 32px;background-size: 100% " + '"></span>' +
                '<span>' + dataItem.name+ '</span>';
        }
    });

然后我有 fieldChangeHandler 函数来设置从数据库检索到的 id

.

getDropDown().setValueIfValid(id)

一切正常，除非保存的记录设置为非活动状态，并且我需要从不同的列表中查找名称来设置值，但不应显示下拉列表。我不知道该怎么做。

Answer 1

您要显示的值必须位于下拉列表的数据源中。 尝试使用活动列表和非活动列表中的名称填充下拉列表。然后在模板（但不是 valueTemplate）中，仅渲染活动元素的可见元素：

template: function (dataItem) {
    if (dataItem.isActive) {
        return '<span style="background-image: url(\'' + "/Style/Images/" + fileName + '\');' + "vertical-align: middle;display: inline-block;width: 32px;height: 32px;background-size: 100% " + '"></span>' +
            '<span>' + dataItem.name+ '</span>';
    } else {
        return "<div style='display: none'></div>";
    }
});

然后，您应该能够将该值设置为非活动项目，并使其显示为所选项目，同时在打开下拉列表时在列表中不可见。