Try Now
More in this section

Forums / Developing with Sitefinity / KendoUI Grid with UIHint

KendoUI Grid with UIHint

2 posts, 0 answered
  1. Ryan
    Ryan avatar
    2 posts
    12 Sep 2013
    03 Dec 2013
    Link to this post

    I'm having some difficulties creating a KendoUI grid with a foreign key using a UIHint to create a dropdown list in the Grid. My hinted partial view doesn't seem to be getting called at all. Is there a code example of a sitefinity site and KendoUI grid working with a foreign key drop down? Or maybe tell me where I am messing mine up?

    Here is what I have right now:


    namespace SitefinityWebApp.Mvc.Models
        public class BFormSimple
            public long Id { get; set; }
            public string Name { get; set; }
            public string PdfPath { get; set; }
            public string Slug { get; set; }
            [Display(Name = "Plan Type"),UIHint("FormTypeForeignKey")]
            public string Type { get; set; }
            public DateTime UploadTime { get; set; }

    Type is the column that I need to show as a drop down when editing a row in the grid.


    @using Kendo.Mvc.UI
    @model object
    @( Html.Kendo().DropDownListFor(m => m)
           .BindTo((SelectList) ViewData["formtypes"]).ToHtmlString()


    Snippet from public ActionResult Index() that sets the ViewData for the MVC control. ent is my EntityFramework object

    var list = ent.formtypes.Select(f => new SelectListItem() {Text = f.formtype1, Value = f.formtype1 }).ToArray();
    ViewData["formtypes"] = new SelectList(list);


    @model SitefinityWebApp.Mvc.Models.PlansEditorModel
          .Columns(columns =>
              columns.Bound(p => p.Name).Title("Name");
              columns.Bound(p => p.PdfPath).Width(200).Title("Path");
              //columns.Bound(p => p.Type).Width(200).Title("Form Type");
              columns.ForeignKey(p => p.Type, (System.Collections.IEnumerable) ViewData["formtypes"], "Value", "Text").Title("Type");
              columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
          .ToolBar(toolbar => toolbar.Create())
          .Editable(editable => editable.Mode(GridEditMode.PopUp))
          .HtmlAttributes(new { style = "height: 100%" })
          .DataSource(dataSource => dataSource
              .Events(events => events.Error("error_handler"))
              .Model(model => {
                                  model.Id(p => p.Id);
                                  model.Field(p => p.Id).Editable(false);
                                  model.Field(p => p.Type).DefaultValue("Enrollment");
              .Create(update => update.Action("EditingPopup_Create", "PlansEditor"))
              .Read(read => read.Action("EditingPopup_Read", "PlansEditor"))
              .Update(update => update.Action("EditingPopup_Update", "PlansEditor"))
              .Destroy(update => update.Action("EditingPopup_Destroy", "PlansEditor"))






  2. Vassil Vassilev
     Vassil Vassilev avatar
    308 posts
    21 Jan 2015
    06 Dec 2013
    Link to this post
    Hi Ryan,

    In Kendo Documentation there is a very close sample to what you are trying to achieve:

    Here is a thread with ForeignKey in Grid as DropDownList:

    You could also find useful the KendoUI code library, where you have access to multiple code samples:

    Vassil Vassilev
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
2 posts, 0 answered