Select in <li> not rendering correctly

[James]

Hi
I am evaluating the KendoUI product and have hit the following issue when putting multiple <select> inside an <li>:

I am having to put extra select inputs (<select id="" />) in just to make them render at all,
without them it looks like alternate selects are being ignored, (eg only day and year are displayed)

Latest KendoUI release, Jquery 1.7.1, both firefox (11.0) and chrome (17.0.963.83)

Thanks

James

<form id="">
         <ul>
<li><label>Date of birth</label><select id="dobDay" data-bind="source: days, value: day" />
<select id="" />
  <select id="dobMonth" data-bind="source: months, value: month" />
  <select id="" />
  <select id="dobYear" data-bind="source: years, value: year" />
<select id="" />
</li>
<li><label for="agent">Agent Name</label></><input id="agent" /></li>
</ul>
</form>

$("#dobDay").kendoDropDownList();
$("#dobMonth").kendoDropDownList();
$("#dobYear").kendoDropDownList();

var viewModel = kendo.observable({
	days: ["1", "2", "3", "4"],
	day: "",
	months: ["January", "Febuary", "March", "April"],
	month: "",
	years: ["1900", "1901", "1902", "1903"],
	year:""
});
kendo.bind($("form"), viewModel);

PS: In firefox this editor doesn't wrap text when it gets to the edge of the text area, it just carries on and you cant see the text.....

[Dimo]

Hello James,

The problem is caused by incorrect HTML markup - <select> elements cannot use self-closing opening tags.

Regards,
Dimo
the Telerik team