I am trying to display a dropdownlist in the grid when I randomly click on the grid the dropdown will appear intermittently?

See more:

ASP.NET

CSS3

HTML5

Kendo

I am trying to display a dropdownlist in the grid but the dropdown does not appear when i click on row of grid . I am only seeing a "textbox" where the dropdownlist should appear. Another odd behavior happens when I randomly click on the grid the dropdown will appear intermittently.

I try some thing......Please suggest some other way How to handle this problem ...????

@(Html.Kendo().Grid<Cmodel>()
        .Name("asd")
        
    .Columns(columns => {
        columns.Bound(s => s.ID).Visible(false);
        columns.Bound(s => s.Name);
        columns.Bound(s => s.Register);
        columns.Bound(s => s.DataType)
            .Width(200)
           .ClientTemplate(Html.Kendo().DropDownList()
          .Name("Value")
          .DataTextField("Value")
          .DataValueField("Key")
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("DataTypes", "Details");
              });
          }).ToClientTemplate()
                    .ToHtmlString()
           );
 
            
        columns.Bound(s => s.ReadWrite);
        columns.Bound(s => s.DataFormula);
        columns.Bound(s => s.DataSource);
    })
        .ToolBar(toolBar => toolBar.Save())
        .Editable(editable => editable.Mode(GridEditMode.InCell))
        .Pageable()
        .Sortable()
        .Scrollable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .Batch(true)
            .ServerOperation(false)
            .Model(model =>
            {
                model.Id(s => s.ID);
                model.Field(s => s.ID).Editable(false);
            })
                .Read(read => read.Action("Sensors_Read", "Details", new { deviceID = @Model.ID } ))
                .Update(update => update.Action("Sensors_Update", "Details"))
        )
     )