dropdowns not showing in grid

6 posts, 0 answers
  1. Greg
    Greg avatar
    28 posts
    Member since:
    Dec 2014

    Posted 28 Feb 2015 Link to this post

    I've spent hours on this and I'm really stumped.  I have a grid that should display dropdowns for two columns:  OwnerID and State.  The columns shows in the grid but not in Edit or New.

    @(Html.Kendo().Grid<ClientViewModel>()
                    .Name("ClientGrid")
                    .Pageable()
                    .Columns(columns =>
                        {
                            columns.Bound(c => c.ClientID);
                            columns.Bound(c => c.ClientName);
                            columns.Bound(c => c.OwnerID).ClientTemplate("#:OwnerID.UserName #").Title("Owner").Width(155);
                            columns.Bound(c => c.Addr1).Visible(true);
                            columns.Bound(c => c.Addr2).Visible(true);
                            columns.Bound(c => c.City).Visible(true);
                            columns.Bound(c => c.State).ClientTemplate("#:State.StateName #").Title("State");
                            columns.Bound(c => c.Zip).Visible(true);
                            columns.Bound(c => c.SoldBy);
                            columns.Bound(c => c.Status);
                            columns.Bound(c => c.Phone);
                            columns.Bound(c => c.VolumnDiscountPct).Title("Vol. DC %").Visible(true);
                            columns.Bound(c => c.VolumnDiscountRange).Title("Vol. DC Range").Visible(true);
                            columns.Bound(c => c.VolumnDiscountRangeType).Title("Vol. DC Type").Visible(true);
                            columns.Bound(c => c.VolumnDiscountStartDate).Title("Vol. DC StartDate").Visible(true);
                            columns.Command(command => {command.Edit(); });
                        })
                     .DataSource(ds => ds
                        .Ajax()
                        .ServerOperation(false)
                        .Read(read => read.Action("GetClients", "Client"))
                        .Update(udt => udt.Action("ClientUpdate", "Client"))
                        .Create(c => c.Action("ClientCreate", "Client"))
                        //.Destroy(d => d.Action("ClientDelete", "Client"))
                        .Model(m =>
                        {
                            m.Id(ur => ur.ClientID);
                            m.Field(ur => ur.OwnerID).DefaultValue(
                                ViewData["defautOwner"] as CCProMVC.Models.CCProUser);
                            m.Field(ur => ur.State).DefaultValue(
                                ViewData["defaultState"] as CCProMVC.Models.StateModel);
                        }))
                     .Editable(e => e.Mode(GridEditMode.PopUp))
                     .ToolBar(t => t.Create())
                    )


    Editors and their Controllers:

    @model CCProMVC.Models.CCProUser

    @(Html.Kendo().DropDownList()
        .Name("OwnerID")
        .DataTextField("UserName")
        .DataValueField("Id")
        .DataSource(d => d
            .Read(r => r.Action("Index", "OwnerIDEditor"))
        )
    )

    @model CCProMVC.Models.StateModel

    @(Html.Kendo().DropDownList()
        .Name("State")
        .DataTextField("StateName")
        .DataValueField("StateAbbrevation")
        .DataSource(d => d
            .Read(r => r.Action("Index", "StateEditor"))
        )
    )

    public class OwnerIDEditorController : Controller
        {
            // GET: OwnerIDEditor
            public JsonResult Index()
            {
                CCProEntities context = new CCProEntities();
                var users = context.AspNetUsers.Select(u => new CCProMVC.Models.CCProUser {Id = u.Id, UserName = u.UserName});

                return this.Json(users, JsonRequestBehavior.AllowGet);
            }
        }

    public class StateEditorController : Controller
        {
            // GET: StateEditor
            public JsonResult Index()
            {
                CCProEntities context = new CCProEntities();
                var states = context.States.Select(s => new StateModel { StateAbbrevation = s.StateAbbrevation, StateName = s.StateName}).OrderBy(s => s.StateName);

                return this.Json(states, JsonRequestBehavior.AllowGet);
            }
        }

    Finally the main Controller:

    public class ClientController : Controller
        {
            // GET: Client
            public ActionResult Index()
            {
                CCProEntities dbContext = new CCProEntities();


                ViewData["defaultState"] = dbContext.States.AsEnumerable().Select(s => new StateModel { StateAbbrevation = s.StateAbbrevation, StateName = s.StateName }).First();
                ViewData["defautOwner"] = dbContext.AspNetUsers.AsEnumerable().Select(u => new CCProUser { Id = u.Id, UserName = u.UserName }).First();

                return View("Client");
            }

            public JsonResult GetClients([DataSourceRequest]DataSourceRequest request)
            {
                CCProEntities dbContext = new CCProEntities();
                var clientsQuery = dbContext.Clients.Select(c => new ClientViewModel
                {
                    ClientID = c.ClientID,
                    ClientName = c.ClientName,
                    OwnerID = new CCProUser { Id = c.AspNetUser.Id, UserName = c.AspNetUser.UserName},
                    OwnershipDate = c.OwnershipDate,
                    Addr1 = c.Addr1,
                    Addr2 = c.Addr2,
                    City = c.City,
                    State = new StateModel { StateAbbrevation = c.State1.StateAbbrevation, StateName = c.State1.StateName },
                    Zip = c.Zip,
                    SoldBy = c.SoldBy,
                    Status = c.Status,
                    Phone = c.Phone,
                    VolumnDiscountPct = c.VolumnDiscountPct,
                    VolumnDiscountRange = c.VolumnDiscountRange,
                    VolumnDiscountRangeType = c.VolumnDiscountRangeType,
                    VolumnDiscountStartDate = c.VolumnDiscountStartDate
                }).OrderBy(o => o.ClientName);

                return Json(clientsQuery.ToDataSourceResult(request));
            }

            [AcceptVerbs(HttpVerbs.Post)]
            public JsonResult ClientCreate([DataSourceRequest] DataSourceRequest request, Models.ClientViewModel client)
            {
                CCProMVC.Client eFClient = new Client();

                var context = new CCProEntities();
                if (client != null && ModelState.IsValid)
                {
                    eFClient.ClientName = client.ClientName;
                    eFClient.Addr1 = client.Addr1;
                    eFClient.Addr2 = client.Addr2;
                    eFClient.City = client.City;
                    eFClient.State = client.State.StateAbbrevation;
                    eFClient.Zip = client.Zip;
                    eFClient.OwnerID = client.OwnerID.Id;
                    eFClient.Phone = client.Phone;
                    eFClient.SoldBy = client.SoldBy;
                    eFClient.VolumnDiscountPct = client.VolumnDiscountPct;
                    eFClient.VolumnDiscountRange = client.VolumnDiscountRange;
                    eFClient.VolumnDiscountRangeType = client.VolumnDiscountRangeType;
                    eFClient.VolumnDiscountStartDate = client.VolumnDiscountStartDate;
                    eFClient.OwnershipDate = client.OwnershipDate;

                    context.Clients.Add(eFClient);
                    context.SaveChanges();
                }

                return Json(ModelState.IsValid ? true : ModelState.ToDataSourceResult());
            }
        }


    I'm using Editor Templates and the Controllers for the editors when I set a breakpoint are not getting hit.

    Any thoughts would be appreciated.

    Greg
     
  2. Greg
    Greg avatar
    28 posts
    Member since:
    Dec 2014

    Posted 28 Feb 2015 in reply to Greg Link to this post

    Screen shot of missing columns from New and Edit.
  3. Dimo
    Admin
    Dimo avatar
    8475 posts

    Posted 03 Mar 2015 Link to this post

    Hi Greg,

    You have stumbled upon a limitation in the ASP.NET MVC framework:

    http://blogs.telerik.com/aspnetmvcteam/posts/10-09-30/using-nested-complex-objects-with-asp-net-mvc-editor-templates.aspx

    You have the following options:

    - use inline or incell editing
    - use a template for the whole popup edit form

    https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/custom-popup-editor

    Regards,
    Dimo
    Telerik

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

  4. Greg
    Greg avatar
    28 posts
    Member since:
    Dec 2014

    Posted 03 Mar 2015 in reply to Dimo Link to this post

    The github page containing the custom-popu-editor doesn't have an option to download the source.  Also I'm curious which complex object was the problem?  I make my own class just like the official Telerik demo on youtube?  Is it that there are too many fields?
  5. Greg
    Greg avatar
    28 posts
    Member since:
    Dec 2014

    Posted 03 Mar 2015 in reply to Dimo Link to this post

    I found the download button.  It was up one level here: https://github.com/telerik/ui-for-aspnet-mvc-examples

    I still am wondering though which complex object is causing the issue.  Your demo used product and category,  I use a user object for Id and Username and State object for abbreviation and StateName.  I didn't use the EF classes. Exactly as your demo does it.
  6. Dimo
    Admin
    Dimo avatar
    8475 posts

    Posted 05 Mar 2015 Link to this post

    Hello Greg,

    The problem is triggered by the CCProUser and StateModel types in ClientViewModel. Our custom editor demo will not work either when you use the Grid MVC wrapper and if you switch from in-cell editing to popup editing.

    Regards,
    Dimo
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top