Question

我们有一个带有内联编辑功能的Kendo网格，可以说在网格下有两行可用。我们编辑第一行，而不保存该行，而是编辑另一个可用行（第二行）。在这种情况下，第一行“操作”将提供三个按钮：“编辑”，“取消”，“撤消”。

我们在模型中为此表格提供了ID字段。我们在所有事件上都具有客户端功能，可以在该网格上执行着色功能。

下面提供了网格代码：

@(Html.Kendo().Grid<ProviderHealthPlanGridDTO>(Model.NewModel.ProviderHealthPlans)
.Name("healthplansGrid")
.Columns(cols =>
{
    cols.Bound(p => p.HealthPlanId).Hidden();
    cols.Bound(p => p.PendingChangeId).Hidden();
    cols.Bound(p => p.ProviderProfileFormFieldOptionSetting).HtmlAttributes(new { @class = "ProviderProfileFormFieldOptionSetting" }).Hidden();
    cols.Bound(p => p.ProviderId).Hidden();
    cols.Bound(p => p.HealthPlanProviderId).Hidden();
    cols.Bound(p => p.IsRemoved).Hidden();
    cols.Bound(p => p.IsAdded).Hidden();
    cols.Bound(p => p.IsChanged).Hidden();
    cols.Bound(p => p.HealthPlanCompanyId).Hidden();
    cols.Bound(p => p.HealthPlanCompanyName).Width("20%").Title("Company Name").EditorTemplateName("HealthPlanCompanyAutoComplete").Sortable(true)
        .Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)))
        .HtmlAttributes(new { @class = "HealthPlanCompanyName" }).ClientTemplate
        (
            @"<span>#: (HealthPlanCompanyName != null) ? HealthPlanCompanyName : '' #</span>"
        );

    cols.Bound(p => p.HealthPlanName).Width("20%").Title("Health Plan Name").EditorTemplateName("HealthPlanAutoComplete").Sortable(true)
        .Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)))
        .HtmlAttributes(new { @class = "HealthPlanName" }).ClientTemplate
        (
            @"<span>#: HealthPlanName #</span>"
        );
    cols.Bound(p => p.InitialDate).Title("Initial Date").HtmlAttributes(new { @class = "InitialDate" }).ClientTemplate("#= (InitialDate != null) ? kendo.toString(InitialDate, \"MM/dd/yyyy\") : '' #").EditorTemplateName("Date").Width("10%");
    cols.Bound(p => p.MostRecentDate).Title("Most Recent Date").HtmlAttributes(new { @class = "MostRecentDate" }).ClientTemplate("#= (MostRecentDate != null) ? kendo.toString(MostRecentDate, \"MM/dd/yyyy\") : '' #").EditorTemplateName("Date").Width("10%");
    cols.Bound(p => p.NextActionDate).Title("Next Action Date").HtmlAttributes(new { @class = "NextActionDate" }).ClientTemplate("#= (NextActionDate != null) ? kendo.toString(NextActionDate, \"MM/dd/yyyy\") : '' #").EditorTemplateName("Date").Width("10%");
    cols.Bound(p => p.TerminationDate).Title("Termination Date").HtmlAttributes(new { @class = "TerminationDate" }).ClientTemplate("#= (TerminationDate != null) ? kendo.toString(TerminationDate, \"MM/dd/yyyy\") : '' #").EditorTemplateName("Date").Width("10%");
    cols.Bound(p => p.TierModel.Value).Width("5%")
                    .EditorTemplateName("DDL_TierModel")
                    .Title("Tier").HtmlAttributes(new { @class = "TierModel" });
    cols.Bound(p => p.AcceptingOptionModel.Value).Width("15%")
                    .EditorTemplateName("DDL_AcceptingNewPatient")
                    .Title("Accepting Patients").HtmlAttributes(new { @class = "AcceptingOptionModel" });
    cols.Command(command =>
    {
        command.Edit().UpdateText("Save").HtmlAttributes(new { @class = !Model.HealthPlansFormField.IsEditOnLanding ? "k-state-disabled" : "", @style = !Model.HealthPlansFormField.IsEditOnLanding ? "pointer-events: none;" : "" });
        command.Custom("Undo").Click("onUndoHealthPlanRemove").HtmlAttributes(new { @class = !Model.HealthPlansFormField.IsEditOnLanding ? "k-state-disabled" : "", @style = !Model.HealthPlansFormField.IsEditOnLanding ? "pointer-events: none;" : "" });
        command.Custom("Remove").Click("onHealthPlanRemove").HtmlAttributes(new { @class = !Model.HealthPlansFormField.IsEditOnLanding ? "k-state-disabled" : "", @style = !Model.HealthPlansFormField.IsEditOnLanding ? "pointer-events: none;" : "" });
    }).Title("Action").Width("20%");
})
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable(pageable => pageable
    .Refresh(true))
.Scrollable()
//.HtmlAttributes(new { style = "height:550px;" })
.Events(events =>
{
    events.DataBound("onHealthPlanGridDataBound");
    events.Edit("onEditHealthPlanGridRow");
    events.Save("onSaveHealthPlanGridRow");
    events.Cancel("onCancelHealthPlanGridRow");
    events.Remove("onHealthPlanRemove");
})
.DataSource(dataSource => dataSource
    .Ajax()
    .Events(ev => ev.RequestEnd("onRequestEnd"))
    .PageSize(10)
    .ServerOperation(false)
    .Model(model =>
    {
        model.Id(p => p.HealthPlanId);
        model.Field(p => p.TierModel).DefaultValue(defaultTier);
        model.Field(p => p.AcceptingOptionModel).DefaultValue(defaultAcceptingOption);
        //model.Field(p => p.TierModel).DefaultValue(new TierModelDTO());
        //model.Field(p => p.AcceptingOptionModel).DefaultValue(new AcceptingNewPatientModelDTO());
    })
    .Create(create => create.Action("AddHealthPlan", "ProviderUpdate").Data("sendAntiForgery"))
    .Update(update => update.Action("UpdateHealthPlan", "ProviderUpdate").Data("sendAntiForgery"))
))

如果您还需要客户端代码段，请提出建议并告诉我。

下面是快照：

Kendo内联编辑干扰，当编辑一行时，如果网格中的另一行已处于编辑模式

0 个答案: