Doha February 2016

Make editable Kendo grid in partial view in MVC

I want to make editable kendo grid as partial view control to use it many times when i needed.

I have customer and employee that have multi address so I want to make editable kendo grid for addresses in partial view to use it in employee and customer.

My partial view for kendo grid is

    @model AddressesModel
@using Kendo.Mvc.UI


@{
    var prefix = ViewData.TemplateInfo.HtmlFieldPrefix;
    var propertyPrefixName = "";
    if (string.IsNullOrEmpty(prefix))
    {
        propertyPrefixName = nameof(AddressesModel.AddressesList);
    }
    else
    {
        propertyPrefixName = prefix + "." + nameof(AddressesModel.AddressesList);
    }
    var cityId = nameof(AddressModel.CityId);
    var email = nameof(AddressModel.Email);

}

@(Html.Kendo().Grid(Model.AddressesList)
              .Name("AddressGrid")
              .ToolBar(tools => tools.Create().Text(GlobalResources.Add))
              .Editable(editable
              => editable.Mode(GridEditMode.InCell).CreateAt(GridInsertRowPosition.Bottom))
              .Columns(columns =>
              {


                  columns.Bound(p => p.CityId).ClientTemplate("#= " + cityId + " #" +
                  "<input type='hidden' name='" + propertyPrefixName + "[#= index(data)#]." + cityId + "' value='#= " + cityId + " #' />"

                       );

                  columns.Bound(p => p.Email).ClientTemplate("#= " + email + " #" +
                    "<input type='hidden' name='" + propertyPrefixName + "[#= index(data)#]." + email + "' value='#= " + email + " #' />"
                  );


                  columns.Command(command => command.Destroy()).Width(20).Title(GlobalResources.Delete);
              })
              .DataSource(dataSource => dataSource.Ajax()
                   .Model(model =>
                   {
                       model.Id(p => p.Id);
                       model.Field(p => p.Id).Editable(false);
                       

Answers


Doha February 2016

change

@Html.Partial("_AddressesGrid", Model.Addresses, new ViewDataDictionary { TemplateInfo = new System.Web.Mvc.TemplateInfo { HtmlFieldPrefix =nameof(CreateEmployeeModel.Addresses)} })

to

@Html.Partial("_AddressesGrid", Model.Addresses)

and be careful don't use HtmlFieldPrefix , the kendo will make editor cell template with error name , so that i have the above error

Post Status

Asked in February 2016
Viewed 3,139 times
Voted 6
Answered 1 times

Search




Leave an answer