剑道组合框设置默认值

时间:2016-05-19 22:54:17

标签: kendo-ui

我有一个带有两个条目的剑道组合框,比如" Thing 1"和"事情2"。我想要"事情1"默认设置。

有没有首选方法可以做到这一点?我似乎无法找到它,虽然我确实将占位符属性设置为" Thing 1"它起作用了。 Kendo文档说占位符是"小部件为空时显示的提示。默认不设置。"我是否错误地使用了占位符?

2 个答案:

答案 0 :(得分:4)

df.rdd.map {t => (t(2).toString + "_" + t(3).toString, t) }.take(5) 属性(我相信你称之为占位符)用于指定不代表选择的文本。当从列表中选择它时,所选项目为空,因此不是设置默认值的正确解决方案,除非您希望默认选择为optionLabel。可以通过调用窗口小部件实例上的null方法以编程方式设置选择。例如,以下内容将选择设置为“Thing1”。

select()

值得注意的是,这不是实现这一目标的唯一方法。我上面的示例使用Imperative(JQuery)语法来声明下拉列表。如果您使用的是ASP.NET MVC服务器包装器,则可以在声明中设置Value属性,例如:

<div id="dropdownlist"></div>

<script type="text/javascript">
    $("#dropdownlist").kendoDropDownList({
        dataSource: [
                'Thing1',
                'Thing2',
                'Thing3'
            ],
            optionLabel: "None"
    });

    $("#dropdownlist").data("kendoDropDownList").select(1);
</script>

最后,如果您使用MVVM进行声明性初始化,则可以将选择绑定到视图模型上的值。我没有使用MVVM示例复杂化我的答案,因为我假设您没有使用此机制。

答案 1 :(得分:2)

   <script> 

        $(function () {

            var data = [
                { text: "12 Angry Men", value: "1" },
                { text: "Il buono, il brutto, il cattivo.", value: "2" },
                { text: "Inception", value: "3" },
                { text: "One Flew Over the Cuckoo's Nest", value: "4" },
                { text: "Pulp Fiction", value: "5" },
                { text: "Schindler's List", value: "6" },
                { text: "The Dark Knight", value: "7" },
                { text: "The Godfather", value: "8" },
                { text: "The Godfather: Part II", value: "9" },
                { text: "The Shawshank Redemption", value: "10" },
                { text: "The Shawshank Redemption 2", value: "11" }
            ];

            $("#movies").kendoComboBox({
                dataTextField: "text",
                dataValueField: "value",
                dataSource: data,

            });
            let combobox = $("#movies").data("kendoComboBox");//This "instantiates it"
            combobox.value("The Godfather");


        });

    </script>

<input id="movies" />

结果: enter image description here