【问题标题】:How to display placeholder by default in kendo-ui如何在 kendo-ui 中默认显示占位符
【发布时间】:2016-07-13 17:23:13
【问题描述】:

我实现了剑道,但我想默认保留占位符,就像选择的行星应该默认显示。

但是当我删除占位符正确显示的选项时,默认情况下会显示选项,如下例所示。

但我的目标是实现默认显示占位符并增加占位符大小。提前致谢。

<!doctype html>
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.common-material.min.css" />
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.material.min.css" />
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.default.mobile.min.css" />
    <script src="//kendo.cdn.telerik.com/2016.2.607/js/jquery.min.js"></script>
    <script src="//kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js"></script>
        <div id="example" role="application">
            <div id="tshirt-view" class="demo-section k-content">
                <h4 style="margin-top: 2em;">Solar System</h4>
                <select id="size" placeholder="Select Planets..." style="width: 220px;" >
                    <option />Mercury
                    <option />Venus
                    <option />Earth
                    <option />Mars
                    <option />Jupiter
                    <option />Plutz
                </select>
            </div>
            <script>
                $(document).ready(function() {
                    // create ComboBox from input HTML element
                    
                    // create ComboBox from select HTML element
                    $("#size").kendoComboBox();

                    var select = $("#size").data("kendoComboBox");
                });
            </script>
        </div>
</!doctype>

【问题讨论】:

标签: javascript jquery html css kendo-ui


【解决方案1】:

根据Kendo documentation for combo box

$("#combobox").kendoComboBox({
  placeholder: "Select..."
});

【讨论】:

    【解决方案2】:

    尝试添加另一个默认选项

    <option value="" disabled selected>Select Planest...</option>
    

    【讨论】:

      猜你喜欢
      • 2017-10-02
      • 2016-02-18
      • 2018-02-12
      • 1970-01-01
      • 2014-10-27
      • 1970-01-01
      • 1970-01-01
      • 2016-05-12
      • 2013-07-21
      相关资源
      最近更新 更多