This is a migrated thread and some comments may be shown as answers.

DataSource Remote Grouping

14 Answers 984 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Brian
Top achievements
Rank 1
Brian asked on 30 Sep 2011, 08:06 PM
Hello all,

I had a quick question. 

I have been looking at Kendo for a couple of days now, and am really impressed. Everything is smooth and works quite well.

My question is: To support remote grouping on a datasource, what gets sent to the server when someone changes the grouping (Meaning query parameters), and how is the data expected to come back to the data source (JSON in my case)?

14 Answers, 1 is accepted

Sort by
0
Rosen
Telerik team
answered on 03 Oct 2011, 01:44 PM
Hello Brian,

By default, params which will be will be the dataSource's sort/filter/group descriptors and paging information if such set. you may use transport's dialect to pass a custom function which can to serialize those descriptors to a custom format. 

new kendo.data.DataSource({
    type: "json" ,  
    transport: {
        read: "Products/Select",
        dialect: function(params) {           
            return erializeParamsFunction(params); //return an object containing the new name/value params to be send to the server
        }
    }  
});

The format which DataSource requires the grouped items to be in is similar to the following:

{
  field: "ProductID", //name of the field on which data is grouped
  value: "Product1", // value of the current group
  items: [item1, item2, item3] // items
  hasSubgroups: false, // there are multiple nested groups and items collection contains groups instead of the actual items
  aggregates: []
}

In case your server returns data in a different format, schema object's group function can be to transform the data.

new kendo.data.DataSource({
    transport: {
        read: "Products/Select"       
    },
    schema: {
        groups: function(data) {
            return myMapGroupsFunction(data);
            // return array of object in the following format:
            //{
            //  field: "ProductID", //name of the field on which data is grouped
            //  value: "Product1", // value of the current group
            //  items: [item1, item2, item3] // items
            //  hasSubgroups: false, // there are multiple nested groups and items collection contains groups instead of the actual items
            //  aggregates: []
            //}
        }
    }   
}).read();

Regards,
Rosen
the Telerik team
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Ryan
Top achievements
Rank 1
answered on 10 Dec 2011, 10:16 PM
I'm trying to set up remote grouping and am not having much success.  My datasource looks like this:

var dataSource = new kendo.data.DataSource({
    serverPaging: true,
    serverSorting: true,
    serverFiltering: true,
    serverGrouping: true,
    pageSize: 20,
    transport: {
        read: {
            type: 'get',
            dataType: 'json',
            url: url
        }
    },
    schema: {
        group: 'group',
        data: 'data',
        total: 'total',
        model: {
            id: 'EmployeeId',
            fields: {
                FirstName: { type: 'string' },
                LastName: { type: 'string' },
                Email: { type: 'string' }
            }
        }
    }
});

My group object contains aggregates, field, hasSubgroups, and items is a list of Employees (Email, EmployeeId, FirstName, and LastName).  Where might I be going wrong?  I can't seem to find a good example of remote grouping anywhere.  Thanks.
0
Rosen
Telerik team
answered on 12 Dec 2011, 01:29 PM
Hi Ryan,

Could you please provide a bit more information about the exact issue you are facing with the remote grouping? Also you could show the data format return from the server.

All the best,
Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Ryan
Top achievements
Rank 1
answered on 12 Dec 2011, 03:14 PM
I attached an image of the json data from fiddler.  With this dataset, I get a grid that shows the "data" object, but there is no grouping.  After looking at some of the telerik examples, I am assuming my data object should contain my group object.
0
Rosen
Telerik team
answered on 13 Dec 2011, 12:37 PM
Hi Ryan,

Could you change the schema to be groups instead of group and see if this makes any difference in the observed behavior.

Regards,
Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Ryan
Top achievements
Rank 1
answered on 13 Dec 2011, 02:50 PM
Yes!  I see a slight change in behavior, but the grid still turns up empty on grouping.  This is the change in behavior I'm seeing:

If I have this:

group: 'asdfasdf'

no error is thrown.  If I have this: 

groups: 'asdfasdf'
 
I receive a javascript error.  With this:

groups: 'group'

I don't get an error when grouping by first name.  Just an empty grid.  I'm not sure if it will help, but this is the way I'm building my json object in C#.

Controller:
public ActionResult List(KendoRequest request)
{
    var employees = _repository.GetAllEmployees(request);
 
    employees.group.field = "FirstName";
    employees.group.aggregates = new string[] { };
    employees.group.hasSubgroups = false;
    employees.group.items = employees.data;
    employees.group.value = "First Name";
 
    return Json(employees, JsonRequestBehavior.AllowGet);
}

Model:
public class KendoGrid<T>
{
    private KendoGroup<T> _group;
 
    public T[] data { get; set; }
    public int total { get; set; }
    public KendoGroup<T> group
    {
        get
        {
            return _group ?? (_group = new KendoGroup<T>());
        }
        set
        {
            _group = value;
        }
    }
}
 
public class KendoGroup<T>
{
    public string field { get; set; }
    public string value { get; set; }
    public T[] items { get; set; }
    public bool hasSubgroups { get; set; }
    public string[] aggregates { get; set; }
}
0
Rosen
Telerik team
answered on 14 Dec 2011, 01:09 PM
Hi Ryan,

The group property of the response should be an array. It should contain the grouped data, thus a separate entry for each unique value should be present. For example:

{
 groups: [
    {
    field = "FirstName",
        aggregates = {},
        hasSubgroups = false,
        items = [ { FirstName = "First Name", LastName = "Last Name 1" },
          { FirstName = "First Name", LastName = "Last Name 2" }],
        value = "First Name"
        },
        {
    field = "FirstName",
        aggregates = {},
        hasSubgroups = false,
        items = [ { FirstName = "First Name 2", LastName = "Last Name 3" },
          { FirstName = "First Name 2", LastName = "Last Name 4" }],
        value = "First Name 2"
        }]
}


Regards,
Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Stef Heyenrath
Top achievements
Rank 1
answered on 31 Oct 2012, 04:44 PM
1)
When doing server side grouping, the JSON data should be returned to client as you describe, correct ? The Grid on the client will not do any processing of the data ?


2)
What should be the content for the aggregates field ?
For example I've defined this on the datasource:
 group: {
                 field: "First",
                 aggregates: [
                     {
                         field: "NumberOfEmployees",
                         aggregate: "count"
                     }
                 ]
             }

And the post request is posted to the server as:
take    4
skip    0
page    1
pageSize    4
group[0][field]    First
group[0][dir]    asc
group[0][aggregates][0][field]    NumberOfEmployees
group[0][aggregates][0][aggregate]    count

should the JSON result contain text below?
"aggregates": { "NumberOfEmployees": { "count": 2 } }

Please advice.
0
Rosen
Telerik team
answered on 01 Nov 2012, 07:59 AM
Hello Stef,

- Indeed, if server operation are enabled the DataSource will not process the data itself but will expect the already processed data from the server.
- Information of the required format of the grouped result can be found here.
- The format in which the operation descriptors are send to the server can be customized using the transport's parameterMap function.

Regards,
Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Joseph
Top achievements
Rank 2
answered on 26 Jan 2016, 09:40 AM

I am new and also very impressed with the Grid.  It was a lot of work...but I created a JSFiddle here showing the GRID I created to assist with this question.

 https://jsfiddle.net/x11joex11/zz3jfp20/15/

 

How do I get this to work with server grouping, server filtering, server sorting and server aggregates?

 

For example what is a sample JSON I can give to the 'read' datasource on the jsfiddle I have so that it will load the table with all the features I mentioned above.  For example...

 I have a database called Company, it has 4fields, id, company name, phone, and email

Many companies might share the same email, so an example of grouping by email and using the aggregate count would be nice to see how that looks as a JSON response.

 Any help is much appreciated!

0
Joseph
Top achievements
Rank 2
answered on 26 Jan 2016, 10:52 PM

I also created a stack overflow showing the issue in more detail.

 

http://stackoverflow.com/questions/35006484/kendo-ui-json-response-for-grid-using-remote-data-source-w-server-grouping

0
Rosen
Telerik team
answered on 28 Jan 2016, 09:48 AM

Hello Joseph,

 

The format of the response expected by the DataSource when remote grouping is set is described in the documentation here. A simple implementation of server operations are demonstrated in Kendo UI PHP wrappers sample application which is accompanying the distribution. You could take a look and use it as a base for your own implementation.

 

Regards,
Rosen
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Vrushabh
Top achievements
Rank 1
answered on 25 Oct 2017, 06:49 AM

Hi,

I'm doing whatever you said in the above post.

I have about 50,000 records, when grouped, the the count of grouped items is 1945.

But, the problem with my grid when the grouping is done, the number of rows showing in the grid is only 1945. the rest is not scrolling down.

0
Stefan
Telerik team
answered on 30 Oct 2017, 06:48 AM
Hello, Vrushabhm,

I can assume that maybe there is an issue with the response format.

Please check the following example using the expected formated where all of the items are shown:

http://jsfiddle.net/knWcJ/74/

If the issue still occurs, please provide a runnable example and I will gladly inspect what may be caused the issue.

Regards,
Stefan
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.
Tags
Data Source
Asked by
Brian
Top achievements
Rank 1
Answers by
Rosen
Telerik team
Ryan
Top achievements
Rank 1
Stef Heyenrath
Top achievements
Rank 1
Joseph
Top achievements
Rank 2
Vrushabh
Top achievements
Rank 1
Stefan
Telerik team
Share this question
or