New to Kendo UI for jQueryStart a free 30-day trial

Remote Flat Data Binding

You can bind the Kendo UI for jQuery PivotGridV2 to JSON data fetched from a remote end point.

For a runnable example on how to bind the PivotGridV2 to a remote flat data review the dedicated demo.

Bind the Data

The code snippet below showcases a small data sample from the Remote Binding demo.

javascript
[{ ProductID: 1, ProductName: "Chai", UnitPrice: "18.00"},
{ ProductID: 2, ProductName: "Chang", UnitPrice: "19.00"},
{ ProductID: 3, ProductName: "Aniseed Syrup", UnitPrice: "10.00"}]

The following code snippet showcases how you can use the transport option to read the data from the remote end point.

javascript
$("#pivotgrid").kendoPivotGridV2({
    dataSource: {
		transport: {
			read: "https://demos.telerik.com/service/v2/core/Products"
		}
        ......
    }
});

Columns and Rows

You can construct the PivotGridV2 table by using the fields from the sample data in the previous section.

  1. Configure the schema.
javascript
         schema: {
 			model: {
 				fields: {
 					ProductID: { type: "number" },
 					ProductName: { type: "string" },
 					UnitPrice: { type: "number" }
 				}
 			},
 			cube: {
 				dimensions: {
 					ProductID: { caption: "All Products" },
 					ProductName: { caption: "All Names" },
 					UnitPrice: { caption: "Total Price" }
 				},
 				measures: {
 					"Price Sum": { field: "UnitPrice", aggregate: "sum" }
 				}
 			}
 		},
  1. Configure the columns, rows, and measures.
javascript
        columns: [{ name: "ProductName", expand: true }],
 		rows: [{ name: "ProductID", expand: true }],
 		measures: ["Price Sum"]

Known Limitations

The known limitations are listed in the following link.