7 Answers, 1 is accepted
You can check the sample application shipped with your distribution. More info can be found here: http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/introduction#running-the-sample-application
Kind regards,Atanas Korchev
the Telerik team
I am afraid that my initial response was wrong.The current official version doesn't include a dedicated popup editing example. We will rectify this problem in our next official release which is due by the end of this month. Please accept my sincere apologies for the inconvenience caused.
Fortunately it is very easy to show how to use popup editing. Take the inline editing example: (<install location>\wrappers\aspnetmvc\Examples\Areas\razor\Views\web\grid\editing_inline.cshtml) and just change the editing mode to popup:
.Editable(editable => editable.Mode(GridEditMode.PopUp))
Atanas Korchev
the Telerik team
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult UpdateEmployee([DataSourceRequest] DataSourceRequest request, Employee emp)
{
if (emp != null && ModelState.IsValid)
{
var empToUpdate = db.Employee.First(a => a.EmpId == emp.EmpId);
if (empToUpdate != null)
{
TryUpdateModel(empToUpdate);
}
}
var viewModel = new EmployeeViewModel
{
EmpId = emp.EmpId,
NameFirst = emp.NameFirst,
NameMiddle = emp.NameMiddle,
NameLast = emp.NameLast,
Title = emp.Title,
};
return Json(new[] { viewModel }.ToDataSourceResult(request));
}
Hope this helps.
$(document).ready(function () {
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "/Region/GetRegion",
dataType: "json"
},
update: {
url: "/Region/EditRegion",
type: "update",
contentType: "application/json; charset=utf-8",
dataType: "json",
},
destroy: {
url: "/Region/DeleteRegion",
type: "Delete",
contentType: "application/json; charset=utf-8",
dataType: "json"
},
create: {
url: "/Region/NewRegion",
type: "Create",
contentType: "application/json; charset=utf-8",
dataType: "json"
},
parameterMap: function (model, operation) {
//debugger;
if (operation !== "read" && model) {
return kendo.stringify(model);
}
}
},
batch: false,
pageSize: 20,
schema: {
model: {
id: "RegionId",
fields: {
RegionId: { editable: false, nullable: true },
RegionName: { validation: { required: true } },
TenantName: { validation: { required: true } },
PlantName: { validation: { required: true } }
}
}
}
});
$("#Regiongrid").kendoGrid({
dataSource: dataSource,
pageable: true,
cache: false,
height: 430,
toolbar: ["create"],
columns: [
{ field: "RegionId", type: "number", title: "Region Id", width: 10 },
{ field: "RegionName", width: 30, title: "Region Name" },
{ field: "TenantName", width: 100, title: "Tenant Name", attributes: { style: "text-align:left;" } },
{ field: "PlantName", width: 30, title: "Plant Name" },
{ command: ["edit", "destroy"], title: " ", width: "160px" }],
editable: "popup",
});
});