Grid Grouping by Foreign Key - Group header wrong

7 posts, 0 answers
  1. leniency
    leniency avatar
    10 posts
    Member since:
    Jan 2012

    Posted 22 Oct 2012 Link to this post

    I'm trying to enable grouping by a foreign key column. However, a default Ajax setup will display the id of the column, not the display text for the group header. With server binding, the group header displays as expected. With Ajax binding however, it won't.

    Using Kendo 2012.2.607. I know this used to work with Telerik, used it all the time.
    @(Html.Kendo().Grid(Model.Users)
        .Name("Users")
        .DataSource(c => c.Ajax()
            .Read("_Roles", "Users")
            .Group(g => g.Add(o => o.RoleId)))
        .Columns(c => {
            c.Bound(o => o.UserName);
            c.ForeignKey(o => o.RoleId, Model.Roles);
            c.Bound(o => o.IsActive);
        })
        .Sortable()
        .Filterable()
        .Groupable()
        .Pageable())

    With this, the group headers will read as "Role: 1", "Role: 2" and so on.  Expected "Role: Admin", "Role: User", etc. Can't really find any options to fix this. Trying to add a ClientGroupHeaderTemplate doesn't work either - always yields an error about whatever value being undefined. The anonymous function called to display the template has no real data to display the correct label.

    c.ForeignKey(o => o.RoleId, Model.Roles)
    .ClientGroupHeaderTemplate("#= Title #");

    Edit - I setup a jsfiddle here to illustrate.
  2. Andrew
    Andrew avatar
    20 posts
    Member since:
    Jun 2012

    Posted 25 Oct 2012 Link to this post

    With regards the ClientGroupHeaderTemplate giving an undefined error, I found that you just need to reference the value of the field rather than the name of the field, i.e.:

    c.ForeignKey(o => o.RoleId, Model.Roles)
        .ClientGroupHeaderTemplate("#= value #");
  3. leniency
    leniency avatar
    10 posts
    Member since:
    Jan 2012

    Posted 25 Oct 2012 Link to this post

    Thanks Andrew, but still doesn't work.  That still only prints out the value part, not the expected text part.  Ie, the headers are still numeric. Note that when doing purely server based rendering, it works fine - this is only an issue with client side.
  4. loic lacomme
    loic lacomme avatar
    1 posts
    Member since:
    Aug 2009

    Posted 07 Nov 2012 Link to this post

    I am having the same problem did you solve the issue?
  5. leniency
    leniency avatar
    10 posts
    Member since:
    Jan 2012

    Posted 13 Nov 2012 Link to this post

    Nope, nothing yet.  The 2012.3.1024 beta doesn't solve the issue.
  6. Lee
    Lee avatar
    31 posts
    Member since:
    Jun 2014

    Posted 31 May 2018 Link to this post

    I'm having same issue.  Has anyone solved this.  I'm using a foreignkey column tthat looks like this;

    columns.ForeignKey(p => p.EmployeeID, (System.Collections.IEnumerable)ViewData["Employees"], "ID", "EmployeeName")

    When I group by EmployeeID I get the numeric value of EmployeeID on the group header.  What I want it to show is the EmployeeName.   My ClientGroupHeaderTemplate looks like this:

     

    .ClientGroupHeaderTemplate("Employee: #= value # (Count: #=count#)")

     

  7. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2466 posts

    Posted 05 Jun 2018 Link to this post

    Hello Lee,

    The ForeignKey column will handle the group headers internally, but once a template is used, that internal logic will not be applied, so you will have to get reference to the "values" collection of the foreignkey column and manually find the corresponding text value. I have create a dojo example with such implementation:
    Hope this helps.


    Regards,
    Konstantin Dikov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top