0

I have implemented a KendoUI Grid.

Here is the Grid implementation in the View.

@(Html.Kendo().Grid<Example.Web.UI.ViewModels.ExampleItem>()
.Name("ExampleGrid")
.Columns(columns =>
{
    columns.Bound(p => p.Name);
    columns.Bound(p => p.Label);
    columns.Bound(p => p.Type);
    columns.Bound(p => p.InputType);

    columns.ForeignKey(p => p.ParentId, (System.Collections.IEnumerable)ViewData["items"], "Id", "Name").Title("Parent");

    columns.Command(command => { command.Edit(); command.Destroy(); });
})
.Scrollable()
.Groupable()
.Sortable()
.Pageable(pageable => pageable
    .Refresh(true)
    .PageSizes(true)
    .ButtonCount(5))

.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .Events(events => events.Error("error_handler"))
    .Model(model =>
            {
                model.Id(p => p.Id);
                model.Field(p => p.Id).DefaultValue(Guid.NewGuid());
                model.Field(p => p.ParentId).DefaultValue(null);
            })
    .Create(update => update.Action("EditingPopup_Create", "Example"))
    .Read(read => read.Action("EditingPopup_Read", "Example"))
    .Update(update => update.Action("EditingPopup_Update", "Example"))
    .Destroy(update => update.Action("EditingPopup_Destroy", "Example"))
)
)

Here is the ExampeItem Model:

public class ExampleItem
{
    [ScaffoldColumn(false)]
    public Guid Id { get; set; }

    public string Name { get; set; }

    public string Label { get; set; }

    public string Type { get; set; }

    [DisplayName("Input Type")]
    public string InputType { get; set; }

    public ExampleItem Parent { get; set; }

    public Guid ParentId { get; set; }
}

In my Controller I set the foreign key items like this:

ViewData["items"] = exampleItems; // This is a List<ExampleItem>

But the Parent column is empty when the Grid is loaded. This is because I used a Guid as the datatype for the Id's.

So I changed the view Model to:

public class ExampleItem
{
    [ScaffoldColumn(false)]
    public int Id { get; set; }

    public string Name { get; set; }

    public string Label { get; set; }

    public string Type { get; set; }

    [DisplayName("Input Type")]
    public string InputType { get; set; }

    public ExampleItem Parent { get; set; }

    public int? ParentId { get; set; }
}

And now everything works. So the question is:

Why does Kendo UI Grid not like Guid datatypes for foreign key fields? Is there a way fix this?

I even tried using a string and that didn't work either.

Is there perhaps additional libraries that needs to be installed so the UI components works better with Guids?

I need the Id's to be of type Guid because the records could be migrated to a different server and the ids needs to be unique.

Shane van Wyk
  • 1,870
  • 1
  • 26
  • 62

0 Answers0