Kendo MVC 批量编辑更改行颜色或焦点

Question

我是Kendo UI MVC 的新手，我在对网格进行批量编辑时尝试自定义行颜色，我在互联网上查找但找不到任何信息。默认情况下编辑用于批量编辑网格的单元格后 Kendo 在单元格的左上角添加一个小红点，编辑任何单元格后我想要实现的是该记录的整行更改更改它的颜色。例如，我想将该行更改为绿色，以便让用户更清楚地看到在单击保存之前编辑了哪些行。如果有人能帮助我，我真的会申请。

代码

@(Html.Kendo().Grid<MvcKendo.Models.Availablity>().Name("grid")

.Columns( columns => {
    columns.Bound(c => c.Id);
    columns.Bound(c => c.TimeFrom);
    columns.Bound(c => c.TimeTo);
})
.DataSource(datasource => datasource.Ajax().PageSize(5)
.Read("GetDataAvailablity","Home"))
.ClientDetailTemplateId("template")   
 )

<script id="template" type="text/kendo-tmpl">
@(Html.Kendo().TabStrip()
        .Name("tabStrip_#=Id#")
        .SelectedIndex(0)
        .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
        .Items(items =>
        {
            items.Add().Text("TimeSheet Details").Content(@<text>@TimeSheetDetails()</text>);             
        })
    .ToClientTemplate()
)

 @helper TimeSheetDetails()
 {
 @(Html.Kendo().Grid<MvcKendo.Models.TimeSheet>()
.Name("grid_#=Id#")
         .Events(e => {
             e.DataBound("onDataBound");
             e.Change("ChangeEvent");
         })
    .Columns(columns =>
    {
        columns.Bound(t => t.Id);
        columns.Bound(t => t.WardName);
    })
    .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple))
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .ToolBar(tb=>tb.Save())
    .DataSource(dataSource => dataSource
        .Ajax().Batch(true)
        .PageSize(5)
            .Model(model=>model.Id(x=>x.Id))
        .Read(read => read.Action("GetDataTimeSheet", "Home", new { Id = "#=Id#" }))
        .Update(update => update.Action("Editing_Update", "Home"))
        .Events(events => events.Error("error_handler"))

    )
.Pageable().Sortable().ToClientTemplate()
)
![enter image description here][2]}

Answer 1

您可以利用 Kendo 网格中的保存事件来实现此目的

C#

.Events(events => events.Save("onSave")

Javascript

function(e) {
    $(e.container).closest("tr").css("background-color","lightgreen");
 }

Here's the fiddle for the sample in JS

Kendo MVC 批量编辑更改行颜色或焦点

Kendo MVC batch editing change row color or focus

kendo-ui

kendo-grid

kendo-asp.net-mvc