Kendo ui 网格在取消对 aspnet mvc 的内联编辑时失败

Question

我最近遇到了一个令人沮丧的问题。我在 asp.net mvc 上使用 kendi ui 网格...我运行遇到的问题是当我打开网格可编辑模式并添加编辑命令和模型 ID 时，一切似乎有效，但存在问题。首先它没有点击控制器上的编辑操作然后如果我取消编辑，该行将消失！

这是我的模型

public class ContactInformation
{
    [Key]
    [ScaffoldColumn(false)]
    public long ContactInfoId { get; set; }

    public string Position { get; set; }

    [Required]
    public string Name { get; set; }

    public string PhoneNumber { get; set; }

    public string CodeToPerson { get; set; }

    public string Fax { get; set; }

    public string CellPhoneNumber { get; set; }

    public string Email { get; set; }

    public virtual Client Client { get; set; }
}

这是控制器

public class ContactsController : Controller
{
    private ApplicationDbContext db = new ApplicationDbContext();

    // GET: dashboard/Contacts
    public ActionResult Default(string id)
    {
        if(id != null)
        {
            ViewBag.clientGuid = id;

            var model = db.Clients.SingleOrDefault(x=>x.ClientGuid == id);
            model.BillingAddresses = db.BillingAddresses.Where(x => x.Client.ClientId == model.ClientId).ToList();
            return View(model);
        }
        return View();
    }        

    public ActionResult Contacts_Read([DataSourceRequest]DataSourceRequest request, string id)
    {
        var contacts = (id != null) ?
                            db.ContactInfos.Where(x => x.Client.ClientGuid == id).ToList() :
                            db.ContactInfos.ToList();

        return Json(GetContacts(contacts).ToDataSourceResult(request),JsonRequestBehavior.AllowGet);
    }

    [HttpPost]
    public JsonResult Contacts_Create([DataSourceRequest]DataSourceRequest request,ContactInformation model)
    {
        // Todo: save the model

        return Json(ModelState.ToDataSourceResult());
    }

    [HttpPost]
    public ActionResult Contacts_Update([DataSourceRequest]DataSourceRequest request, ContactInformation model)
    {
        if(model != null)
        {
            var contactToUpdate = db.ContactInfos.Find(model.ContactInfoId);
            contactToUpdate.Name = model.Name;
            contactToUpdate.Position = model.Position;
            contactToUpdate.PhoneNumber = model.PhoneNumber;
            contactToUpdate.CodeToPerson = model.CodeToPerson;
            contactToUpdate.CellPhoneNumber = model.CellPhoneNumber;
            contactToUpdate.Fax = model.Fax;
            contactToUpdate.Email = model.Email;
            contactToUpdate.Client = db.Clients.Find(model.Client.ClientId);

            db.SaveChanges();

        }

        return Json(ModelState.ToDataSourceResult());
    }

    public IEnumerable<ContactInformation> GetContacts(List<ContactInformation> contacts)
    {
        return contacts.Select(contactInfo => new ContactInformation
        {
            Position = contactInfo.Position,
            Name = contactInfo.Name,
            PhoneNumber = contactInfo.PhoneNumber,
            CodeToPerson = contactInfo.CodeToPerson,
            Fax = contactInfo.Fax,
            CellPhoneNumber = contactInfo.CellPhoneNumber,
            Email = contactInfo.Email,
            Client = new Client()
            {
                CompanyName = contactInfo.Client.CompanyName,
                IndustryCategory = contactInfo.Client.IndustryCategory,
                IndustrySubCategory = contactInfo.Client.IndustrySubCategory
            }
        });
    }
}

这是风景

 @(Html.Kendo().Grid<ContactInformation>().Name("Contacts")
        .Columns(
            columns.Bound(c => c.Client.IndustryCategory).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.Client.IndustrySubCategory).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.Name).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.Position).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.PhoneNumber).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.CodeToPerson).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.CellPhoneNumber).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.Fax).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Bound(c => c.Email).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
            columns.Command(command =>
            {
                command.Edit();                    
            }).Width(100);
        })
        .ToolBar(tools =>
        {
            tools.Excel();
        })
        .Excel(excel => excel
            .FileName("ContactsData.xlsx")
            .Filterable(true)
            .ProxyURL(Url.Action("Excel_Export_Save"))
        )
        .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
        .Pageable(pageable => pageable
                    .Refresh(true)
                    .PageSizes(true)
                    .ButtonCount(5))
        .Scrollable()
        .Sortable()
        .Groupable()
        .Events(events=>events.Cancel("error_handler"))
        .Editable(editable => editable.Mode(GridEditMode.InLine))
        .HtmlAttributes(new { style = "height:500px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .Model(Model=> {
                Model.Id(c => c.ContactInfoId);
                Model.Field(c => c.Client.IndustryCategory).Editable(false);
                Model.Field(c => c.Client.IndustrySubCategory).Editable(false);
            })
            //.Create(create => create.Action("Contacts_Create", "Contacts"))
            .Read(read => read.Action("Contacts_Read", "Contacts", new { id = ViewBag.clientGuid }))
            .Update(update => update.Action("Contacts_Update", "Contacts", new { id = ViewBag.clientGuid }))
            .PageSize(20)
        )
        .ColumnMenu()
)



<script type="text/javascript">
function error_handler(e) {
    if (e.errors) {
        var message = "Errors:\n";
        $.each(e.errors, function (key, value) {
            if ('errors' in value) {
                $.each(value.errors, function() {
                    message += this + "\n";
                });
            }
        });
        alert(message);
    }
}
</script>

有趣的是，项目中还有一个名为inquiry的模型，它的网格与这个相同，并且可以正常工作quite。实际上，它们 quite 是相同的，但我不明白为什么它不像另一个那样工作！

Answer 1

我在这里看到的第一件事是您在控制器中的方法是 HttpPost 但是在更新函数的定义中（在 Telerik 网格上）您没有指定它。这意味着，该网格正在尝试触发默认值 - 它是 HttpGet -> 这就是未触发更新的原因。

您需要定义更新方式为Post

.Update(update => update.Action("Contacts_Update", "Contacts", new { id = ViewBag.clientGuid }).Type(HttpVerbs.Post))

Kendo ui 网格在取消对 aspnet mvc 的内联编辑时失败

Kendo ui grid fails at canceling the inline edit on aspnet mvc

asp.net

asp.net-mvc

kendo-ui

kendo-ui-grid