New to Kendo UI for jQuery? Download free 30-day trial

Use MobileSwitch as Editor in Grid for MVC


Product Progress® Telerik® UI Grid for ASP.NET MVC
Product Version 2017.2 504
Preferred Language C Sharp
MVC Version MVC 5
View Engine Razor


Howe can I display a MobileSwitch when the Grid is in an edit mode?

Suggested Workarounds

The Kendo UI Grid does not provide a built-in solution for achieving this behavior. However, you can still work around this issue.

By default, the MobileView does not support the usage of a MobileSwitch but you can use it as an editor within the Grid by applying the following approach:

  1. Create a new partial view for the MobileSwitch editor in the Views/Shared/EditorTemplates folder. For the example, name it MobileSwitchTemplate.cshtml.

    @model bool
    <input type="checkbox" data-bind="value: @Html.ViewData["FieldName"].ToString()" class="mySwitch"/>
  2. Specify the template and pass the field name in ViewData for the column you want to use that editor. Copy the following code:

    columns.Bound(p => p.Discontinued).Width(120).EditorTemplateName("MobileSwitchTemplate").EditorViewData(new { FieldName = "Discontinued" });
  3. Initialize the MobileSwitch within the edit event of the Grid.

    <script type="text/javascript">
        function onEdit(e) {
In this article