How to display placeholder by default in kendo-ui

Question

I implemented kendo but i want to keep the place holder by default like select planets should be displayed on default.

But the options are displaying by default as seen in the below example when i remove the options the place holder is displaying properly.

But my aim is to achieve to display the place holder by default and also increase the place holder size. Thanks in advance.

 <!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>

Answer 1

Per the Kendo documentation for combo box :

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

Answer 2

尝试添加另一个默认选项

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

How to display placeholder by default in kendo-ui

Question

2 answers

solution1
3 ACCPTED 2016-07-13 17:26:26

solution2
2 2016-07-13 17:30:53

How to display placeholder by default in kendo-ui

Question

2 answers

solution1 3 ACCPTED 2016-07-13 17:26:26

solution2 2 2016-07-13 17:30:53

solution1
3 ACCPTED 2016-07-13 17:26:26

solution2
2 2016-07-13 17:30:53