New to Kendo UI for jQuery? Download free 30-day trial

PivotConfiguratorV2 Overview

The Kendo UI PivotConfiguratorV2 represents an OLAP cube structure.

The PivotConfiguratorV2 can be used for configuring the column and row dimensions, and the measure fields of the PivotGridV2. It is a supplementary component which is strongly related to the Kendo UI PivotDataSourceV2 component.

Initializing the PivotConfiguratorV2

There are four elements that need to be configured for the PivotConfiguratorV2 to function properly:

  • PivotGridV2—The PivotGridV2 component which will be managed by the PivotConfiguratorV2.
  • PivotConfiguratorV2—The configurator component itself.
  • PivotConfiguratorButton—The button which expands/collapses the PivotConfiguratorV2.
  • PivotContainer—The container which holds all of the above components.

The following example demonstrates the HTML structure of the elements.

<div id="container">
    <div id="pivotgrid"></div>
    <div id="configurator"></div>
    <div id="pivotbutton"></div>

Basic Configuration

The following example demonstrates how to configure the components.

    $(document).ready(function () {
        // Initialize the PivotGridV2.
        var pivotgrid = $("#pivotgrid").kendoPivotGridV2({
            height: 700,
            dataSource: {
                type: "xmla",
                columns: [{ name: ['[Date].[Calendar]'], expand: true }],
                rows: [{ name: ['[Geography].[City]'], expand: true }],
                measures: [{ name: ['[Measures].[Reseller Freight Cost]'] }],
                transport: {
                    connection: {
                        catalog: "Adventure Works DW 2008R2",
                        cube: "Adventure Works"
                    read: ''

        // Initialize the PivotConfiguratorV2
            dataSource: pivotgrid.dataSource, // The dataSource should be the same as the one the PivotGridV2 is using.
            filterable: true,
            sortable: true,
            height: 580

        // Initialize the PivotContainer.
            configuratorPosition: "left" // The PivotConfiguratorV2 will appear to the left of the PivotGridV2.

        // Initialize the PivotConfiguratorButton.
            configurator: "configurator" // Specify which KendoConfiguratorV2 component will the button be related to.

The following image demonstrates the output from the previous example.

Kendo UI for jQuery PivotConfiguratorV2 Overview

Referencing Existing Instances

To reference an existing PivotConfigurator instance, use the method. Once a reference has been established, use the PivotConfigurator API to control its behavior.

The following example demonstrates how to access an existing PivotConfigurator instance.

var pivotconfigurator = $("#pivotconfigurator").data("kendoPivotConfiguratorV2");

See Also

In this article