Kendo 与选定行一起进行网格内联编辑无法正常工作

Question

我的 kendo 网格具有 selected 行和内联编辑功能。当我在没有 select 一行的情况下单击编辑按钮时，它会显示我正在做的更改。

但是如果我先 select 一行然后尝试编辑它隐藏所有值。

我的格子代码

@(Html.Kendo().Grid<VmSegment>()
      .Name("VmSegment")
      .Events(e => e.Change("onChange"))
      .Columns(columns =>
      {
          columns.Group(group => group
              .HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"})
              .Title("Chainage (m)")
              .Columns(info =>
              {
                  info.Bound(p => p.FromChain).HtmlAttributes(new {style = "text-align:right"}).Title("From").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Width(40);
                  info.Bound(p => p.ToChain).HtmlAttributes(new {style = "text-align:right"}).Title("To").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Width(40);
              })
              );
          columns.Template(p => { }).Title("Segment Length").HtmlAttributes(new {style = "text-align:right"}).HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).ClientTemplate("#=calculate(data)#").Width(60);

          columns.Bound(p => p.SurfaceType).ClientTemplate("#=SurfaceType.surfaceTypeName#").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Title("Surface Type").Width(55);

          columns.Group(group => group
              .HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"})
              .Title("Average Width (m)")
              .Columns(info =>
              {
                  info.Bound(p => p.AvgCargW).HtmlAttributes(new {style = "text-align:right"}).Title("Carriage").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Width(70);
                  info.Bound(p => p.AvgShoulW_R).HtmlAttributes(new {style = "text-align:right"}).Title("Shoulder Right").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Width(70);
                  info.Bound(p => p.AvgShoulW_L).HtmlAttributes(new {style = "text-align:right"}).Title("Shoulder Left").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Width(70);
              })
              );
          columns.Group(group => group
              .HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"})
              .Title("Condition")
              .Columns(info =>
              {
                  info.Bound(p => p.SlopeCondition).ClientTemplate("#=SlopeCondition.Name#").Title("Slope").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Width(60);
                  info.Bound(p => p.ShoulderCondition).ClientTemplate("#=ShoulderCondition.Name#").Title("Shoulder").HeaderHtmlAttributes(new {style = "text-align:center;font-weight:bold;vertical-align: middle"}).Width(60);
              })
              );
          columns.Command(command =>
          {
              command.Edit().HtmlAttributes(new {style = "text-align:center", @id = "Edit", title = "Edit"}).Text(" ");
              command.Destroy().HtmlAttributes(new {@id = "rm", title = "Delete"}).Text(" ");
              command.Custom("ViewMap").Click("showMap").HtmlAttributes(new {@class = "", @id = "", title = "Map"}).Text(" ");
              command.Custom("ViewDetails").Click("showDetails").HtmlAttributes(new {@class = "", @id = "target3", title = "Details"}).Text(" ");
              command.Custom("ViewPhoto").Click("showPhoto").HtmlAttributes(new {@class = "", @id = "", title = "Photo"}).Text(" ");
          }).Width(120);
      })
      .ToolBar(toolBar => toolBar.Template("<a style = 'text-align:center;font-weight:bold;hover' title='First select a row.' class='k-button k-button-icontext add'></span>+Add New Record</a>")) // The "create" command adds new data items
      .Editable(editable => editable.Mode(GridEditMode.InLine))
      .Selectable(selectable => selectable
                .Type(GridSelectionType.Row))  
      //.Sortable()
      .Pageable(pageable => pageable.Refresh(true))
      .ColumnMenu()
      .DataSource(dataSource => dataSource          
          .Ajax()
          .PageSize(10)

          .Events(e =>
          {
              //e.Error("onError");
              e.Sync("KendoGridRefresh");
              // e.Change("onChange");
              //e.Change("onChange");
          })
          .Model(model =>
          {
              model.Id(p => p.Id);

              model.Field(p => p.FromChain).Editable(false);

              model.Field(p => p.SurfaceType).DefaultValue(
                  ViewData["defaultSurfaceType"] as VmSurfaceType);

              model.Field(p => p.SlopeCondition).DefaultValue(
                  ViewData["defaultconditionSlope"] as VmCondition);

              model.Field(p => p.ShoulderCondition).DefaultValue(
                  ViewData["defaultconditionShoulder"] as VmConditionShoulder);
          })
          .Read(r => r.Action("Read", "Segment"))
          .Create(r => r.Action("Create", "Segment"))
          .Update(r => r.Action("Update", "Segment"))
          .Destroy(r => r.Action("Delete", "Segment"))
      )
      .Events(ev => ev.DataBound("resetRowNumber").DataBound("onRowBound"))
      .Events(ev => ev.Cancel("onCancel"))


      )

Answer 1

实际上问题是当我 select 任何行并进入编辑选项时，该行的背景颜色变为白色。因此，它不显示数据。只需更改 .k-state-selected class 背景颜色即可。

Kendo 与选定行一起进行网格内联编辑无法正常工作

Kendo Grid inline editing with selected row together doesn't work properly

telerik

telerik-grid

kendo-ui

kendo-grid