Kendo UI DropDowList on Mobile Device

[Daniel]

Hi,

I am tweaking my web site so that certain pages are mobile friendly.
I have been using the Kendo DropDownList on my pages and was hoping that it would render nicely on mobile devices as well.

@(Html.Kendo().DropDownListFor(m => m.Acc).OptionLabel("Select Service").BindTo(Model.AccountsList).HtmlAttributes(new { style = "width: 300px;" }))

This renders on the mobile devices but when you click on it the popup is displayed inline as it does with a normal web browser and not using the native select list that normal Select elements use on mobiles which is a lot easier to use and less buggy.

Is there a way to get the dropdownlist to render as a native select element on mobile devices instead of the fancy javascript way it uses on desktop web browsers?

This would allow me to use css rules to change the style for mobile viewing instead of rewriting the page for the mobile version to get rid of the kendo ui dropdownlists.

Thanks.

[Kiril Nikolov]

Hello Daniel,

In general when used in mobile applications the Kendo UI DropDownList renders in a mobile friendly way using an actionsheet, you can see this functionality in the following demo:

http://demos.telerik.com/kendo-ui/mobile-forms/index

However showing the native input widgets is not possible, as they only work for standard HTML components. If you want to show the native pickers, then use a normal HTML input tag with the appropriate type.

Regards,
Kiril Nikolov
Telerik