Pivot client

29 May 201924 minutes to read

The pivot client is an ad hoc analysis tool that can be easily bound to any OLAP and relational datasources to provide a visual presentation of the information retrieved from the database.

Syntax

JAVASCRIPT

$(element).ejPivotClient()

Example

HTML

<div id="PivotClient1"></div>
 
    <script>
        //Create PivotClient
        $("#PivotClient1").ejPivotClient(...);     
    </script>

Requires

module: jQuery-3.0.0.min.js
module: ej.core.js
module: ej.data.js
module: ej.globalize.js
module: ej.touch.js
module: ej.draggable.js
module: ej.scroller.js
module: ej.chart.js
module: ej.synchart.js
module: ej.rangescrollbar.js
module: ej.tooltip.js
module: ej.button.js
module: ej.checkbox.js
module: ej.dropdownlist.js
module: ej.dialog.js
module: ej.togglebutton.js
module: ej.toolbar.js
module: ej.maskedit.js
module: ej.waitingpopup.js
module: ej.menu.js
module: ej.treeview.js
module: ej.tab.js
module: ej.pivot.common.js
module: ej.pivotanalysis.base.js
module: ej.olap.base.js
module: ej.pivotchart.js
module: ej.pivottreemap.js
module: ej.pivotpager.js
module: ej.pivotgrid.js
module: ej.pivotschemadesigner.js
module: ej.pivotclient.js

Members

analysisMode `enum`

Sets the mode for the pivot client widget for binding the OLAP or relational data sources.

Default Value: ej.Pivot.AnalysisMode.Pivot

Name	Description
Pivot	To bind Relational datasource to PivotClient widget
OLAP	To bind OLAP datasource to PivotClient widget

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ analysisMode: ej.Pivot.AnalysisMode.Olap });

chartType `enum`

Allows you to set the specific chart type for the pivot chart in the pivot client widget.

Default Value: ej.PivotChart.ChartTypes.Column

Name	Description
Line	To render a Line type for PivotChart.
Spline	To render a Spline type for PivotChart.
Column	To render a Column type for PivotChart.
Area	To render an Area type for PivotChart.
SplineArea	To render a SplineArea type for PivotChart.
StepLine	To render a StepLine type for PivotChart.
StepArea	To render a StepArea type for PivotChart.
Pie	To render a Pie type for PivotChart.
Bar	To render a Bar type for PivotChart.
StackingArea	To render a StackingArea type for PivotChart.
StackingColumn	To render a StackingColumn type for PivotChart.
StackingBar	To render a StackingBar type for PivotChart.
Pyramid	To render a Pyramid type for PivotChart.
Funnel	To render a Funnel type for PivotChart.
Doughnut	To render a Doughnut type for PivotChart.
Scatter	To render a Scatter type for PivotChart.
Bubble	To render a Bubble type for PivotChart.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ chartType: ej.PivotChart.ChartTypes.Spline });

clientExportMode `enum`

Allows you to set the content for exporting the pivot client widget.

Default Value: ej.PivotClient.ClientExportMode.ChartAndGrid

Name	Description
ChartAndGrid	Exports both the PivotChart and PivotGrid on exporting.
ChartOnly	Exports the PivotChart control alone on exporting.
GridOnly	Exports the PivotGrid control alone on exporting.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ clientExportMode: ej.PivotClient.ClientExportMode.ChartOnly });

cssClass `string`

Specifies the CSS class to the pivot client for achieving the custom theme.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ cssClass: "Olive" });

customObject `object`

An object is utilized to pass the additional information between the client-end and the service-end when the control functions are present in the server-mode.

Default Value: {}

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ customObject: { "MyMessage": "Hi Syncfusion!!" } });

dataSource `object`

Initializes the data source for the pivot client widget, when it functions completely on the client-side.

Default Value: {}

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient( { dataSource: { data: value } });

dataSource.columns `array`

Lists out the items to be arranged in the columns section of the pivot client.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: itemsArray } });

dataSource.columns.fieldName `string`

Allows you to bind the item by using its unique name as field name.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName : "MyFieldName" }] } });

dataSource.columns.fieldCaption `string`

Allows you to set the display caption for an item.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldCaption : "MyFieldCaption" }] } });

dataSource.columns.advancedFilter `array`

Allows you to filter the report by default using the advanced filtering (e.g., Microsoft Excel) option for the OLAP data source in the client-mode.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : itemArray }] } });

dataSource.columns.advancedFilter.name `string`

Allows you to provide a level unique name to perform the advanced filtering.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : [{ name: "levelUniqueName" }] }] } });

dataSource.columns.advancedFilter.labelFilterOperator `string`

Allows you to set the operator to perform label filtering.

Default Value: “none”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : [{ labelFilterOperator: ej.olap.LabelFilterOptions.EndsWith }] }] } });

dataSource.columns.advancedFilter.valueFilterOperator `string`

Allows you to set the operator to perform value filtering.

Default Value: “none”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : [{ valueFilterOperator: ej.olap.ValueFilterOptions.Between }] }] } });

dataSource.columns.advancedFilter.advancedFilterType `string`

Allows you to set the filtering type while performing the advanced filtering.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : [{ advancedFilterType:  ej.olap.AdvancedFilterType.LabelFilter }] }] } });

dataSource.columns.advancedFilter.measure `string`

In value filtering, this property contains the measure name to which the filter is applied.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : [{ measure: "measureUniqueName", advancedFilterType: ej.olap.AdvancedFilterType.ValueFilter }] }] } });

dataSource.columns.advancedFilter.values `array`

Allows you to hold the filter operand values in the advanced filtering.

Default Value: “”

Example:

JAVASCRIPT

//For Label Filters
    $("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : [{ labelFilterOperator: ej.olap.LabelFilterOptions.EndsWith, values:  ["002"] }] }] } });
    
    //For Value Filters
    $("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ advancedFilter : [{ valueFilterOperator: ej.olap.ValueFilterOptions.GreaterThan, values:  ["200"] }] }] } });

dataSource.columns.isNamedSets `boolean`

Allows you to indicate whether the added item is a named set or not.

Note: This is applicable only for the OLAP data source.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName: "[Core Product Group]", isNamedSets : true }] } });

dataSource.columns.showSubTotal `boolean`

Shows/hides the sub-total of the field in the pivot grid.

Note: This is applicable only for the relational data source.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName: "Country", showSubTotal : false }] } });

dataSource.columns.format `string`

Allows to set the format for the column headers.

Note: This is applicable only for the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ format : "date" }] } });

dataSource.columns.formatString `string`

This property is set to display the formatted values with format types in the pivot grid.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ formatString : "MM/DD/YYYY" }] } });

dataSource.columns.cssClass `string`

Allows you to set the custom theme for the column headers.

Note: This is applicable only for the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ cssClass : "className" }] } });

dataSource.columns.sortOrder `enum`

Allows you to set the sorting order of members of the field.

Note: This is applicable only for the relational data source.

Default Value: ej.PivotAnalysis.SortOrder.Ascending

Name	Description
Ascending	Sorts the members of the field in ascending order.
Descending	Sorts the members of the field in descending order.
None	Displays the members without sorting in any order.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName: "Country", sortOrder : ej.PivotAnalysis.SortOrder.Descending }] } });

dataSource.columns.drilledItems `array`

Contains the list of members need to be drilled down by default in the field.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName: "Country", drilledItems : ["Canada", "France"] }] } });

dataSource.columns.filterItems `object`

Applies the filter to field members.

Default Value: null

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Exclude, values: ["Canada", "France"] } }] } });

dataSource.columns.filterItems.filterType `enum`

Sets the type of filter whether to include/exclude the mentioned values.

Note: This is applicable only for the relational data source.

Default Value: ej.PivotAnalysis.FilterType.Exclude

Name	Description
Exclude	Excludes the specified values among the members of the field.
Include	Includes the specified values alone among the members of the field.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Include, values: valueArray } }] } });

dataSource.columns.filterItems.values `array`

Contains the collection of items to be included/excluded among the field members.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { columns: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Exclude, values: ["Canada", "France"] } }] } });

dataSource.rows `array`

Lists out the items to be arranged in the rows section of the pivot client.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: itemsArray } });

dataSource.rows.fieldName `string`

Allows you to bind the item by using its unique name as field name.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName : "MyFieldName" }] } });

dataSource.rows.fieldCaption `string`

Allows you to set the display caption for an item.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldCaption : "MyFieldCaption" }] } });

dataSource.rows.advancedFilter `array`

Allows you to filter the report by using the advanced filtering (e.g., Microsoft Excel) option for the OLAP data source in the client-mode.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : itemArray }] } });

dataSource.rows.advancedFilter.name `string`

Allows you to provide a level unique name to perform the advanced filtering.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : [{ name: "levelUniqueName" }] }] } });

dataSource.rows.advancedFilter.labelFilterOperator `string`

Allows you to set the operator to perform the label filtering.

Default Value: “none”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : [{ labelFilterOperator: ej.olap.LabelFilterOptions.EndsWith }] }] } });

dataSource.rows.advancedFilter.valueFilterOperator `string`

Allows you to set the operator to perform the value filtering.

Default Value: “none”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : [{ valueFilterOperator: ej.olap.ValueFilterOptions.Between }] }] } });

dataSource.rows.advancedFilter.advancedFilterType `string`

Allows you to set the filtering type while performing the advanced filtering.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : [{ advancedFilterType:  ej.olap.AdvancedFilterType.LabelFilter }] }] } });

dataSource.rows.advancedFilter.measure `string`

In value filtering, this property contains the measure name to which the filter is applied.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : [{ measure: "measureUniqueName", advancedFilterType: ej.olap.AdvancedFilterType.ValueFilter }] }] } });

dataSource.rows.advancedFilter.values `array`

Allows you to hold the filter operand values in the advanced filtering.

Default Value: “”

Example:

JAVASCRIPT

//For Label Filters
    $("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : [{ labelFilterOperator: ej.olap.LabelFilterOptions.EndsWith, values:  ["002"] }] }] } });
    
    //For Value Filters
    $("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ advancedFilter : [{ valueFilterOperator: ej.olap.ValueFilterOptions.GreaterThan, values:  ["200"] }] }] } });

dataSource.rows.isNamedSets `boolean`

Allows you to indicate whether the added item is a named set or not.

Note: This is applicable only for the OLAP data source.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName: "[Core Product Group]", isNamedSets : true }] } });

dataSource.rows.showSubTotal `boolean`

Shows/hides the sub-total of the field.

Note: This is applicable only for the relational data source.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName: "Country", showSubTotal : false }] } });

dataSource.rows.format `string`

Allows to set the format for row headers.

Note: This is applicable only for the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ format : "date" }] } });

dataSource.rows.formatString `string`

This property is set to display the formatted values with format types in the pivot grid.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ formatString : "MM/DD/YYYY" }] } });

dataSource.rows.cssClass `string`

Allows to set the custom theme for row headers.

Note: This is applicable only for the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ cssClass : "className" }] } });

dataSource.rows.sortOrder `enum`

Allows you to set the sorting order for the field members.

Note: This is applicable only for the relational data source.

Default Value: ej.PivotAnalysis.SortOrder.Ascending

Name	Description
Ascending	Sorts the members of the field in ascending order.
Descending	Sorts the members of the field in descending order.
None	Displays the members without sorting in any order.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName: "Country", sortOrder : ej.PivotAnalysis.SortOrder.Descending }] } });

dataSource.rows.drilledItems `array`

Contains the list of members need to be drilled down by default in the field.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName: "Country", drilledItems : ["Canada", "France"] }] } });

dataSource.rows.filterItems `object`

Applies the filter to the field members.

Default Value: null

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Exclude, values: ["Canada", "France"] } }] } });

dataSource.rows.filterItems.filterType `enum`

Sets the type of filter whether to include/exclude the mentioned values.

Note: This is applicable only for the relational data source.

Default Value: ej.PivotAnalysis.FilterType.Exclude

Name	Description
Exclude	Excludes the specified values among the members of the field.
Include	Includes the specified values alone among the members of the field.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Include, values: valueArray } }] } });

dataSource.rows.filterItems.values `array`

Contains the collection of items to be included/excluded among the field members.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { rows: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Exclude, values: ["Canada", "France"] } }] } });

dataSource.values `array`

Lists out the items which supports calculation in the pivot client.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: itemsArray } });

dataSource.values.fieldName `string`

Allows you to bind the item by using its unique name as field name for the relational data source.

Note: This is applicable only for the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ fieldName : "MyFieldName" }] } });

dataSource.values.fieldCaption `string`

Allows you to set the display caption for an item for the relational data source.

Note: This is applicable only for the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ fieldCaption : "MyFieldCaption" }] } });

dataSource.values.measures `array`

This holds the list of unique names of measures to bind them from the OLAP cube.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ measures : itemsArray }] } });

dataSource.values.measures.fieldName `string`

Allows you to bind the measure from the OLAP data source by using its unique name as field name.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ measures : [{ fieldName: "MeasureUniqueName" }] }] } });

dataSource.values.axis `string`

Allows to set the axis name to place the measures items.

Note: This is applicable only for the OLAP data source.

Default Value: “rows”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ axis : ej.olap.AxisName.Row }] } });

dataSource.values.isCalculatedField `boolean`

Indicates whether the field is a calculated field or not with the relational data source.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ isCalculatedField : true }] } });

dataSource.values.summaryType `enum`

Allows to set the type of the pivot grid summary calculation for the value field with the relational data source.

Default Value: ej.PivotAnalysis.SummaryType.Sum

Example:

Name	Description
Sum	Calculates the summary as the total of all values.
Average	Displays the average of all values as the summaries.
Count	Displays the count of items in summaries.
Min	Displays the minimum value of all the items in the summary.
Max	Displays the maximum value of all the items in the summary.

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ summaryType : ej.PivotAnalysis.SummaryType.Average }] } });

dataSource.values.format `string`

Allows to set the format of the values.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ format : "percentage" }] } });

dataSource.values.formatString `string`

This property is set to display the formatted values with format types in the pivot grid.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ formatString : "MM/DD/YYYY" }] } });

dataSource.values.cssClass `string`

Allows to set the custom theme for the values.

Note: This is applicable only for the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ cssClass : "className" }] } });

dataSource.values.formula `string`

Allows to set the formula for calculation of members values in the relational data source.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { values: [{ formula : "Quantity*10" }] } });

dataSource.filters `array`

Lists out the items which supports filtering of values without displaying the members in UI of the pivot client.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { filters: itemsArray } });

dataSource.filters.fieldName `string`

Allows you to bind the item by using its unique name as field name.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { filters: [{ fieldName : "MyFieldName" }] } });

dataSource.filters.fieldCaption `string`

Allows you to set the display name for an item.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { filters: [{ fieldCaption : "MyFieldCaption" }] } });

dataSource.filters.filterItems `object`

Applies filter to the field members.

Default Value: null

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { filters: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Exclude, values: ["Canada", "France"] } }] } });

dataSource.filters.filterItems.filterType `enum`

Sets the type of filter whether to include/exclude the mentioned values.

Note: This is applicable only for the relational data source.

Default Value: ej.PivotAnalysis.FilterType.Exclude

Name	Description
Exclude	Excludes the specified values among the members of the field.
Include	Includes the specified values alone among the members of the field.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { filters: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Include, values: valueArray } }] } });

dataSource.filters.filterItems.values `array`

Contains the collection of items to be included/excluded among the field members.

Default Value: []

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { filters: [{ fieldName: "Country", filterItems : { filterType: ej.PivotAnalysis.FilterType.Exclude, values: ["Canada", "France"] } }] } });

dataSource.cube `string`

Contains the respective cube name from the OLAP database as string type.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { cube: "Adventure Works" } });

dataSource.sourceInfo `string`

Allows to set the data source name to fetch the data from that.

Note: This is applicable only for the Mondrian connection.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { sourceInfo: "Provider Mondrian" } });

dataSource.providerName `string`

Sets the provider name for the pivot client to identify whether the provider is SSAS or Mondrian.

Note: This is applicable only for the client side OLAP data.

Default Value: “ssas”

Name	Description
ssas	To bind an OLAP data source to PivotClient through SSAS provider.
mondrian	To bind a relational data source to PivotClient through Mondrian provider.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { providerName: "mondrian" } });

dataSource.data `object`

Provides the raw data source for the pivot client.

Default Value: null

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { data: value } });

dataSource.catalog `string`

In connection with an OLAP database, this property contains the database name as string to fetch the data from the given connection string.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient( { dataSource: { catalog: "databaseName" } } );

dataSource.enableAdvancedFilter `boolean`

Allows you to filter the members (by its name and values) through the advanced filtering (e.g., Microsoft Excel) option in the client-mode.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { enableAdvancedFilter: true } });

dataSource.reportName `string`

Sets a name to the report bound to the control.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { reportName: "Default Report" } });

dataSource.pagerOptions `object`

Allows to set the page size and current page number for each axis on applying the paging.

Note: This is applicable only for binding the OLAP data from the client-side.

Default Value: {}

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { pagerOptions: pagerSettings } });

dataSource.pagerOptions.categoricalPageSize `number`

Allows to set the number of categorical columns to be displayed in each page on applying the paging.

Default Value: 0

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { pagerOptions: { categoricalPageSize: 10 } } });

dataSource.pagerOptions.seriesPageSize `number`

Allows to set the number of series rows to be displayed in each page on applying the paging.

Default Value: 0

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { pagerOptions: { seriesPageSize: 5 } } });

dataSource.pagerOptions.categoricalCurrentPage `number`

Allows to set the page number in the categorical axis to be loaded by default.

Note: This is applicable only for binding the OLAP data from the client-side.

Default Value: 1

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { pagerOptions: { categoricalCurrentPage: 3 } } });

dataSource.pagerOptions.seriesCurrentPage `number`

Allows to set the page number in the series axis to be loaded by default.

Default Value: 1

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ dataSource: { pagerOptions: { seriesCurrentPage: 7 } } });

enableDrillThrough `boolean`

Enables the drill-through feature which retrieves the raw items that are used to create a specific cell in the pivot grid.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableDrillThrough: true });

displaySettings `object`

Allows you to customize the layout and appearance of the widget.

Default Value: {}

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ displaySettings: settingsObject });

displaySettings.controlPlacement `enum`

Allows you to customize the display of the pivot chart and pivot grid widgets in the tabs or tiles.

Default Value: ej.PivotClient.ControlPlacement.Tab

Name	Description
Tab	Displays PivotChart and PivotGrid widgets in separate tabs.
Tile	Displays PivotChart and PivotGrid widgets one above the other.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ displaySettings: { controlPlacement: ej.PivotClient.ControlPlacement.Tile } });

displaySettings.defaultView `enum`

Allows you to set either the chart or grid as the start-up widget.

Default Value: ej.PivotClient.DefaultView.Grid

Name	Description
Chart	To set PivotChart as a default control in view.
Grid	To set PivotGrid as a default control in view.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ displaySettings: { defaultView: ej.PivotClient.DefaultView.Chart } });

displaySettings.enableFullScreen `boolean`

Allows you to switch to full screen view of the pivot chart and the pivot grid from default view in the pivot client.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ displaySettings: { enableFullScreen: true } });

displaySettings.enableTogglePanel `boolean`

Enables an option to enhance the space for the pivot grid and pivot chart by hiding the cube browser and the axis element builder.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ displaySettings: { enableTogglePanel: true } });

displaySettings.mode `enum`

Sets the display mode (only chart/only grid/both) in the pivot client.

Default Value: ej.PivotClient.DisplayMode.ChartAndGrid

Name	Description
ChartOnly	To display only PivotChart widget.
GridOnly	To display only PivotGrid widget.
ChartAndGrid	To display both PivotChart and PivotGrid widgets.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ displaySettings: { mode: ej.PivotClient.DisplayMode.ChartOnly } });

toolbarIconSettings `object`

Allows you to set the visibility of icons in the toolbar panel.

Default Value: {}

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: settingsObject });

toolbarIconSettings.enableAddReport `boolean`

Allows you to set the visibility of Add Report icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableAddReport : true} });

toolbarIconSettings.enableNewReport `boolean`

Allows you to set the visibility of New Report icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableNewReport : true} });

toolbarIconSettings.enableRenameReport `boolean`

Allows you to set the visibility of Rename Report icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableRenameReport : true} });

toolbarIconSettings.enableDBManipulation `boolean`

Allows you to set the visibility of DB Manipulation icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableDBManipulation : true} });

toolbarIconSettings.enableWordExport `boolean`

Allows you to set the visibility of Word Export icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableWordExport : true} });

toolbarIconSettings.enableExcelExport `boolean`

Allows you to set the visibility of Excel Export icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableExcelExport : true} });

toolbarIconSettings.enablePdfExport `boolean`

Allows you to set the visibility of PDF Export icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enablePdfExport : true} });

toolbarIconSettings.enableMDXQuery `boolean`

Allows you to set the visibility of MDX Query icon in the toolbar panel.

Note: This is not applicable for the relational data source.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableMDXQuery : true} });

toolbarIconSettings.enableDeferUpdate `boolean`

Allows to set the visibility of Defer Update icon in the toolbar panel.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableDeferUpdate : true} });

toolbarIconSettings.enableFullScreen `boolean`

Allows to set the visibility of Full Screen icon in the toolbar panel.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableFullScreen : true} });

toolbarIconSettings.enableSortOrFilterColumn `boolean`

Allows you to set the visibility of Sort/Filter Column icon in the toolbar panel.

Note: This is only applicable for the OLAP data bound from the server-side.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableSortOrFilterColumn : true} });

toolbarIconSettings.enableSortOrFilterRow `boolean`

Allows you to set the visibility of Sort/Filter Row icon in the toolbar panel.

Note: This is only applicable for the OLAP data bound from the server-side.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableSortOrFilterRow : true} });

toolbarIconSettings.enableToggleAxis `boolean`

Allows you to set the visibility of Toggle Axis icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableToggleAxis : true} });

toolbarIconSettings.enableChartTypes `boolean`

Allows you to set the visibility of Chart Types icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableChartTypes : true} });

toolbarIconSettings.enableRemoveReport `boolean`

Allows you to set the visibility of Remove Report icon in the toolbar panel.

Default Value: true

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableRemoveReport : true} });

toolbarIconSettings.enableCalculatedMember `boolean`

Allows you to set the visibility of Calculated Member icon in the toolbar panel.

Note: This is applicable only for the OLAP data bound from the server-side.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ toolbarIconSettings: {enableCalculatedMember : true} });

showUniqueNameOnPivotButton `boolean`

Allows you to show a unique name on the pivot button.

Note: This is only applicable for the OLAP data source.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ showUniqueNameOnPivotButton: true });

showReportCollection `boolean`

Allows you to load the saved report collection from the database.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ showReportCollection: true });

enableSplitter `boolean`

Enables the splitter option for resizing the elements in the control.

Note: This is not applicable for the OLAP data bound from the server-side.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableSplitter: true });

enableAdvancedFilter `boolean`

Enables the advanced filtering options such as value filtering, label filtering, and sorting for each dimensions when binding the OLAP data in the server mode.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableAdvancedFilter: true });

enableDeferUpdate `boolean`

Allows you to refresh the control on-demand and not during the every UI operation.

Note: This property is applicable for OLAP data bound from the server-side alone.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableDeferUpdate: true });

enableLocalStorage `boolean`

Allows to save and load the reports in a customized way with the help of events.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableLocalStorage: true });

enablePaging `boolean`

Allows you to enable the paging for both the pivot chart and the pivot grid components for viewing the large data.

Note: This property is applicable only for the OLAP data bound from the client-side.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enablePaging: true });

enablePivotTreeMap `boolean`

Allows you to include the pivot tree map component as one of the chart types.

Note: This property is applicable only for the OLAP data bound from the server-side.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enablePivotTreeMap: true });

enableRTL `boolean`

Allows you to view the layout of the pivot client from right to left.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableRTL: true });

enableMeasureGroups `boolean`

Enables/disables the visibility of measure group selector drop-down in the cube browser.

Note: This property is applicable only for the OLAP data source bound from the server-side.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableMeasureGroups : true });

enableCellClick `boolean`

Allows you to get cell details in JSON format by clicking the value cell.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableCellClick: true });

enableCellDoubleClick `boolean`

Allows you to get cell details in JSON format by double-clicking the value cell.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableCellDoubleClick: true });

enableVirtualScrolling `boolean`

Allows you to enable the virtual scrolling for both the pivot chart and pivot grid components for viewing the large data.

Note: This is applicable only for the OLAP data.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableVirtualScrolling: true });

maxNodeLimitInMemberEditor `number`

Allows you to set the maximum number of nodes as well as child nodes to be displayed in the member editor.

Default Value: 1000

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ maxNodeLimitInMemberEditor: 1500 });

enableMemberEditorPaging `boolean`

Enables/disables paging in the member editor for viewing the large count of members in the pages.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableMemberEditorPaging: true });

memberEditorPageSize `number`

Allows you to set the number of members to be displayed in each page of the member editor on applying the paging in it.

Default Value: 100

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ memberEditorPageSize: 50 });

enableMemberEditorSorting `boolean`

Enables/Disables sorting option in member editor dialog for the members of the respective field.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableMemberEditorSorting: true });

gridLayout `enum`

Sets the summary layout for the pivot grid. Following are the ways in which the summary can be positioned: normal summary (bottom), top summary, no summary, and Microsoft Excel summary.

Note: This property is applicable only for the OLAP data bound from the server-side.

Default Value: ej.PivotGrid.Layout.Normal

Name	Description
Normal	To set normal summary layout in PivotGrid.
NormalTopSummary	To set layout with summaries at the top in PivotGrid.
NoSummaries	To set layout without summaries in PivotGrid.
ExcelLikeLayout	To set excel-like layout in PivotGrid.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ gridLayout: ej.PivotGrid.Layout.NoSummaries });

collapseCubeBrowserByDefault `boolean`

Allows you to hide the cube browser and the axis element builder of the pivot client while initiating the widget.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ collapseCubeBrowserByDefault: true });

enableKPI `boolean`

Allows you to view the KPI elements in tree-view of the pivot client’s cube browser.

Note: This property is applicable only for the OLAP data.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableKPI: true });

isResponsive `boolean`

Allows you to enable the pivot client’s responsiveness in the browser layout.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ isResponsive: true });

size `object`

Options to customize the size of the pivot client control.

Default Value: { height: “685px”, width: “1000px” }

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ size: { width: "50%" , height: "80%" } });

locale `string`

Allows you to set the localized language for the widget.

Default Value: “en-US”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ locale: "fr-FR" });

operationalMode `enum`

Sets the mode for the pivot client widget to bind the data source in the server-side or the client-side.

Name	Description
ClientMode	To bind data source completely from client-side.
ServerMode	To bind data source completely from server-side.

Default Value: ej.Pivot.OperationalMode.ClientMode

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ operationalMode: ej.Pivot.OperationalMode.ServerMode });

serviceMethodSettings `object`

Allows you to set the custom name for methods at service-end, and it is communicated during the AJAX post.

Note: This property is applicable only for operating the control from the server-side.

Default Value: {}

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: value });

serviceMethodSettings.cubeChanged `string`

Allows you to set the custom name for the service method that is responsible for updating the entire report and widget, while changing the cube.

Default Value: “CubeChanged”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { cubeChanged: "CubeChangedMyMethod" } });

serviceMethodSettings.exportPivotClient `string`

Allows to set the custom name for the service method responsible for exporting.

Default Value: “Export”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { exportPivotClient: "ExportMyMethod" } });

serviceMethodSettings.fetchMemberTreeNodes `string`

Allows you to set the custom name for the service method that is responsible to get the members for tree-view in the member-editor dialog.

Default Value: “FetchMemberTreeNodes”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { fetchMemberTreeNodes: "FetchMemberTreeNodesMyMethod" } });

serviceMethodSettings.fetchReportList `string`

Allows you to set the custom name for the service method that is responsible for fetching the report names from the database.

Default Value: “FetchReportListFromDB”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { fetchReportList: "FetchReportListFromDBMyMethod" } });

serviceMethodSettings.filterElement `string`

Allows you to set the custom name for the service method that is responsible for updating the report while filtering the members.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { filterElement: "filterElementMyMethod" } });

serviceMethodSettings.initialize `string`

Allows you to set the custom name for the service method that is responsible for initializing the pivot client.

Default Value: “InitializeClient”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { initialize: "InitializeClientMyMethod" } });

serviceMethodSettings.loadReport `string`

Allows you to set the custom name for the service method that is responsible for loading a report collection from the database.

Default Value: “LoadReportFromDB”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { loadReport: "LoadReportFromDBMyMethod" } });

serviceMethodSettings.removeDBReport `string`

Allows you to set the custom name for the service method that is responsible to remove a report collection from the database.

Default Value: “RemoveReportFromDB”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { removeDBReport: "RemoveReportFromMyDBMethod" } });

serviceMethodSettings.renameDBReport `string`

Allows you to set the custom name for the service method that is responsible for renaming the report collection in the database.

Default Value: “RenameReportInDB”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { renameDBReport: "RenameReportInMyDBMethod" } });

serviceMethodSettings.mdxQuery `string`

Allows you to set the custom name for the service method that is responsible for retrieving the MDX query for the current report.

Note: This is applicable only with the bounded OLAP data.

Default Value: “GetMDXQuery”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { mdxQuery: "GetMDXQueryMyMethod" } });

serviceMethodSettings.measureGroupChanged `string`

Allows you to set the custom name for the service method that is responsible for updating the tree-view in the cube browser, while changing the measure group.

Default Value: “MeasureGroupChanged”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { measureGroupChanged: "MeasureGroupChangedMyMethod" } });

serviceMethodSettings.memberExpand `string`

Allows you to set the custom name for the service method that is responsible to get the child members, on tree-view node expansion.

Default Value: “MemberExpanded”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { memberExpand: "MemberExpandedMyMethod" } });

serviceMethodSettings.nodeDropped `string`

Allows you to set the custom name for the service method that is responsible for updating the report while dropping a node/split button in the axis element builder.

Default Value: “NodeDropped”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { nodeDropped: "NodeDroppedMyMethod" } });

serviceMethodSettings.removeSplitButton `string`

Allows you to set the custom name for the service method that is responsible to update the report while removing the split button from the axis element builder.

Default Value: “RemoveSplitButton”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { removeSplitButton: "RemoveSplitButtonMyMethod" } });

serviceMethodSettings.saveReport `string`

Allows you to set the custom name for the service method that is responsible for saving the report collection in the database.

Default Value: “SaveReportToDB”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { saveReport: "SaveReportToDBMyMethod" } });

serviceMethodSettings.toggleAxis `string`

Allows you to set the custom name for the service method that is responsible for toggling the elements in the row and column axes.

Default Value: “ToggleAxis”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { toggleAxis: "ToggleAxisMyMethod" } });

serviceMethodSettings.toolbarServices `string`

Allows you to set the custom name for the service method that is responsible for all the toolbar operations.

Default Value: “ToolbarOperations”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { toolbarServices: "ToolbarOperationsMyMethod" } });

serviceMethodSettings.updateReport `string`

Allows you to set the custom name for the service method that is responsible for updating the report collection.

Default Value: “UpdateReport”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({  serviceMethodSettings: { updateReport: "UpdateReportFromMyMethod" } });

serviceMethodSettings.paging `string`

Allows you to set the custom name for the service method while navigating between the pages in the paged pivot client.

Default Value: “Paging”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({  serviceMethodSettings: { calculatedMember: "CalculatedMember" } });

serviceMethodSettings.calculatedMember `string`

Allows you to set the custom name for the service method that is responsible for updating the report with the calculated member.

Default Value: “CalculatedMember”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({  serviceMethodSettings: { paging: "PagingMyMethod" } });

serviceMethodSettings.valueSorting `string`

Allows you to set the custom name for the service method that is responsible for performing value sorting operation in the PivotClient.

Default Value: “ValueSorting”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { valueSorting: "MyValueSorting" } });

serviceMethodSettings.drillThroughHierarchies `string`

Allows you to set the custom name for the service method that is responsible for performing the drill through operation.

Default Value: “DrillThroughHierarchies”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { drillThroughHierarchies: "MyDrillThroughHierarchiesMethod" } });

serviceMethodSettings.drillThroughDataTable `string`

Allows you to set the custom name for the service method that is responsible for performing the drill through operation in the data table.

Default Value: “DrillThroughDataTable”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ serviceMethodSettings: { drillThroughDataTable: "MyDrillThroughDataTableMethod" } });

valueSortSettings `object`

Holds the necessary properties for value sorting.

Note: This is applicable only for the relational datasource.

Default Value: {}

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ valueSortSettings: { } });

valueSortSettings.headerText `string`

Contains the header of the specific column to which value sorting is applied.

Note: This is applicable only for the relational datasource.

Default Value: “”

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ valueSortSettings: { headerText: "Bike##Amount" } });

valueSortSettings.headerDelimiters `string`

Allows you to set the string for separating column headers provided in the headerText property.

Note: This is applicable only for the relational datasource.

Default Value: “”

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ valueSortSettings: { headerDelimiters: "##" } });

valueSortSettings.sortOrder `enum`

Allows you to set the sorting order of values of the field.

Note: This is applicable only for the relational datasource.

Default Value: ej.PivotAnalysis.SortOrder.Ascending

Name	Description
Ascending	Sorts the members of the field in ascending order.
Descending	Sorts the members of the field in descending order.
None	Displays the members without sorting in default order.

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ valueSortSettings: { sortOrder: ej.PivotAnalysis.SortOrder.Descending } });

title `string`

Sets the title for the pivot client widget.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ title: "OLAP Browser" });

url `string`

Connects the service using the specified URL for any server updates.

Default Value: “”

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ url: "/wcf/OlapService" });

enableCompleteDataExport `boolean`

Allows you to export entire data instead of current page data, while paging option is enabled.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableCompleteDataExport: true });

enableXHRCredentials `boolean`

Allows you to enable “withCredentials” property inside XMLHttpRequest object for CORS(Cross-Origin Resource Sharing) request.

Default Value: false

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({ enableXHRCredentials: true });

var clientObj = $("#PivotClient1").data("ejPivotClient");
    clientObj.generateJSON(jsonData);//jsonData object holds the data in JSON format required to render the control

refreshControl()

Re-renders the control with the report at that instant.

Note: This method can be used only for the client-side operation.

Example:

JAVASCRIPT

var clientObj = $("#PivotClient1").data("ejPivotClient");
    clientObj.refreshControl();

getActiveTab()

Returns the control tab string that displays currently in the pivot client.

Example:

JAVASCRIPT

var clientObj = $("#PivotClient1").data("ejPivotClient");
    var report = clientObj.getActiveTab();

destroy()

This function destroys all events of the pivot client widget bound using “this._on” and bring the control to pre-init state.

Example:

JAVASCRIPT

var clientObj = $("#PivotClient1").data("ejPivotClient");
    clientObj.destroy();

getOlapReport()

Returns the OLAP report string that is maintained along with the axis elements information.

Returns:

string

Example:

JAVASCRIPT

var clientObj = $("#PivotClient1").data("ejPivotClient");
    var report = clientObj.getOlapReport();

setOlapReport()

Sets the OLAP report string along with the axis information and maintains it in a property.

Example:

JAVASCRIPT

var clientObj = $("#PivotClient1").data("ejPivotClient");
    clientObj.setOlapReport(olapReportObj);

getJSONRecords()

Returns the formed JSON records to render the control.

Returns:

array

Example:

JAVASCRIPT

var clientObj = $("#PivotClient1").data("ejPivotClient");
    var jsonRecords = clientObj.getJSONRecords();

setJSONRecords()

Sets the formed JSON records to render the control to a property.

Example:

JAVASCRIPT

var clientObj = $("#PivotClient1").data("ejPivotClient");
    clientObj.setJSONRecords(jsonRecords);

Events

afterServiceInvoke

Triggers when it reaches the client-side after any AJAX request.

Event Parameters
Name	Type	Description
action	string	returns the current action of PivotClient control.
customObject	object	returns the custom object bounds with PivotClient control.
element	object	returns the HTML element of PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        afterServiceInvoke: function(args) { }
    });

beforeServiceInvoke

Triggers before any AJAX request is passed from the client-side to the service methods.

Event Parameters
Name	Type	Description
action	string	returns the current action of PivotClient control.
customObject	object	returns the custom object bounds with PivotClient control.
element	object	returns the HTML element of PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        beforeServiceInvoke: function(args) { }
    });

saveReport

Triggers before saving the current collection of reports.

Event Parameters
Name	Type	Description
targetControl	object	returns the current instance of PivotClient control.
saveReportSetting	object	returns the object which holds the necessary parameters required for saving the report collection.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        saveReport: function(args) { }
    });

loadReport

Triggers before loading the saved collection of reports.

Event Parameters
Name	Type	Description
targetControl	object	returns the current instance of PivotClient control.
loadReportSetting	object	returns the object which holds the necessary parameters required for loading a report collection from database.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        loadReport: function(args) { }
    });

fetchReport

Triggers before fetching the report collection from the storage.

Event Parameters
Name	Type	Description
targetControl	object	returns the current instance of PivotClient control.
fetchReportSetting	object	returns the object which holds the necessary parameters required for fetching the report names stored in database.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        fetchReport: function(args) { }
    });

beforeExport

Triggers before exporting the control.

Event Parameters
Name	Type	Description
url	string	holds the url of the service method responsible for exporting the PivotClient control.
fileName	string	holds the name of the file to be exported.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        beforeExport: function(args) { }
    });

chartLoad

Triggers before rendering the pivot chart.

Event Parameters
Name	Type	Description
action	string	returns the current action of PivotChart control.
customObject	object	returns the custom object bound with PivotChart control.
element	object	returns the HTML element of PivotChart control.

</td>
</tr>
</tbody>
</table>

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        chartLoad: function (args) { }
    });

schemaLoad

Triggers before rendering the pivot schema designer.

</thead> </table> </td> </tr>

Event Parameters
Name	Type	Description
action	string	returns the current action of PivotSchemaDesigner control.
element	object	returns the HTML element of PivotSchemaDesigner control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        schemaLoad: function (args) { }
    });

treeMapLoad

Triggers before rendering the pivot tree map.

Event Parameters
Name	Type	Description
action	string	returns the current action of PivotTreeMap control.
customObject	object	returns the custom object bound with PivotTreeMap control.
element	object	returns the HTML element of PivotTreeMap control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        treeMapLoad: function (args) { }
    });

gridDrillSuccess

Triggers when performing the drill up/down operation on the row/columns headers.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
axis	string	returns the axis class name of the drilled cell in PivotGrid.
cellPosition	string	returns the position of the drilled cell.
drillAction	string	returns the drill action name.
drilledMember	string	returns the drilled cell string.
fieldName	string	returns the field/item name of the drilled cell.
model	object	returns the model object bound with PivotClient control.
gridObj	object	returns the object bound with PivotGrid control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        gridDrillSuccess: function (args) { }
    });

chartDrillSuccess

Triggers when performing the drill operation on the chart series.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
element	object	returns the HTML element of PivotChart control.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        chartDrillSuccess: function (args) { }
    });

treeMapDrillSuccess

Triggers when performing the drill operation on the tree map.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
element	object	returns the HTML element of PivotTreeMap control.
model	object	returns the model object bound with PivotTreeMap control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        treeMapDrillSuccess: function (args) { }
    });

valueCellHyperlinkClick

Triggers when clicking any value cell in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
args	object	returns the clicked cell information.
customerObject	object	returns the custom object bounds with PivotClient control.
element	object	returns the HTML element of PivotGrid control.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        valueCellHyperlinkClick: function (args) { }
    });

rowHeaderHyperlinkClick

Triggers when clicking any row header cell in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
args	object	returns the clicked cell information.
customerObject	object	returns the custom object bounds with PivotClient control.
element	object	returns the HTML element of PivotGrid control.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        rowHeaderHyperlinkClick: function (args) { }
    });

columnHeaderHyperlinkClick

Triggers when clicking any column header cell in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
args	object	returns the clicked cell information.
customerObject	object	returns the custom object bounds with PivotClient control.
element	object	returns the HTML element of PivotGrid control.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        columnHeaderHyperlinkClick: function (args) { }
    });

summaryCellHyperlinkClick

Triggers when clicking any summary cell in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
args	object	returns the clicked cell information.
customerObject	object	returns the custom object bounds with PivotClient control.
element	object	returns the HTML element of PivotGrid control.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        summaryCellHyperlinkClick: function (args) { }
    });

cellContext

Triggers when right-clicking a cell in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
cellType	string	returns the clicked cell type in PivotGrid.
cellPosition	string	returns the position of the clicked cell.
cellValue	string	returns the HTML string of the clicked cell.
rawdata	string	returns the clicked cell string.
role	string	returns the role of the clicked cell.
uniqueName	string	returns the unique name of the clicked cell.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        cellContext: function (args) { }
    });

cellSelection

Triggers when select/click any of the cell in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
JSONRecords	array	returns the JSON information of the clicked cell.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        cellSelection: function (args) { }
    });

cellEdit

Triggers when any of the value cell is edited in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
editCellsInfo	object	returns the edited cell information.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        cellEdit: function (args) { }
    });

cellClick

Triggers when click action is performed over a grid value cell.

Event Parameters
Name	Type	Description
selectedData	array	returns the JSON details of the respective on cell.
customObject	object	returns the custom object bound with PivotClient control.
element	object	returns the HTML element of PivotGrid control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        cellClick: function (args) {}
    });

cellDoubleClick

Triggers when double-click on any of the value cell in the pivot grid.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
customerObject	object	returns the custom object bounds with PivotClient control.
element	object	returns the HTML element of PivotGrid control.
model	object	returns the model object bound with PivotClient control.
selectedData	array	returns the array of selected data source object for the clicked value cell.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        cellDoubleClick: function (args) { }
    });

pointRegionClick

Triggers when clicking on any chart series points in the pivot chart.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
data	object	returns the clicked Chart series points information.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        pointRegionClick: function (args) { }
    });

axesLabelRendering

Triggers before the chart label is rendered in the pivot chart.

Event Parameters
Name	Type	Description
type	string	returns the current action of PivotClient control.
data	object	returns the Chart label information.
model	object	returns the model object bound with PivotClient control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        axesLabelRendering: function (args) { }
    });

drillThrough

Triggers while clicking the value cells in the pivot grid.

Event Parameters
Name	Type	Description
data	object	return the JSON records of the generated cells on drill-through operation.
element	object	returns the HTML element of PivotClient.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        drillThrough: function (args) {}
    });

load

Triggers while initiating the loading of the widget.

Event Parameters
Name	Type	Description
element	object	returns the HTML element of PivotClient component.
customObject	object	returns the custom object bound with PivotTreeMap control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        load: function (args) { }
    });

renderComplete

Triggers when the pivot client widget completes all operations at client-end after any AJAX request.

Event Parameters
Name	Type	Description
element	object	returns the HTML element of PivotClient component.
customObject	object	returns the custom object bound with PivotTreeMap control.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        renderComplete: function (args) { }
    });

renderFailure

Triggers when any error is occurred during the AJAX request.

Event Parameters
Name	Type	Description
customObject	object	returns the custom object bound with the control.
element	object	returns the HTML element of PivotClient control.
message	string	returns the error message with error code.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        renderFailure: function (args) { }
    });

renderSuccess

Triggers when the pivot client is completely rendered.

Event Parameters
Name	Type	Description
args	object	returns the object of PivotClient control at that instant.

Example:

JAVASCRIPT

$("#PivotClient1").ejPivotClient({
        renderSuccess: function (args) { }
    });

Pivot client

Syntax

Example

Requires

Members

analysisMode enum

Default Value: ej.Pivot.AnalysisMode.Pivot

chartType enum

Default Value: ej.PivotChart.ChartTypes.Column

clientExportMode enum

Default Value: ej.PivotClient.ClientExportMode.ChartAndGrid

cssClass string

Default Value: “”

customObject object

Default Value: {}

dataSource object

Default Value: {}

dataSource.columns array

Default Value: []

dataSource.columns.fieldName string

Default Value: “”

dataSource.columns.fieldCaption string

Default Value: “”

dataSource.columns.advancedFilter array

Default Value: []

dataSource.columns.advancedFilter.name string

Default Value: “”

dataSource.columns.advancedFilter.labelFilterOperator string

Default Value: “none”

dataSource.columns.advancedFilter.valueFilterOperator string

Default Value: “none”

dataSource.columns.advancedFilter.advancedFilterType string

Default Value: “”

dataSource.columns.advancedFilter.measure string

Default Value: “”

dataSource.columns.advancedFilter.values array

Default Value: “”

dataSource.columns.isNamedSets boolean

Default Value: false

dataSource.columns.showSubTotal boolean

Default Value: true

dataSource.columns.format string

Default Value: “”

dataSource.columns.formatString string

Default Value: “”

dataSource.columns.cssClass string

Default Value: “”

dataSource.columns.sortOrder enum

Default Value: ej.PivotAnalysis.SortOrder.Ascending

dataSource.columns.drilledItems array

Default Value: []

dataSource.columns.filterItems object

Default Value: null

dataSource.columns.filterItems.filterType enum

Default Value: ej.PivotAnalysis.FilterType.Exclude

dataSource.columns.filterItems.values array

Default Value: []

dataSource.rows array

Default Value: []

dataSource.rows.fieldName string

Default Value: “”

dataSource.rows.fieldCaption string

Default Value: “”

dataSource.rows.advancedFilter array

Default Value: []

dataSource.rows.advancedFilter.name string

Default Value: “”

dataSource.rows.advancedFilter.labelFilterOperator string

Default Value: “none”

dataSource.rows.advancedFilter.valueFilterOperator string

Default Value: “none”

dataSource.rows.advancedFilter.advancedFilterType string

Default Value: “”

dataSource.rows.advancedFilter.measure string

Default Value: “”

dataSource.rows.advancedFilter.values array

Default Value: “”

dataSource.rows.isNamedSets boolean

Default Value: false

dataSource.rows.showSubTotal boolean

analysisMode `enum`

chartType `enum`

clientExportMode `enum`

cssClass `string`

customObject `object`

dataSource `object`

dataSource.columns `array`

dataSource.columns.fieldName `string`

dataSource.columns.fieldCaption `string`

dataSource.columns.advancedFilter `array`

dataSource.columns.advancedFilter.name `string`

dataSource.columns.advancedFilter.labelFilterOperator `string`

dataSource.columns.advancedFilter.valueFilterOperator `string`

dataSource.columns.advancedFilter.advancedFilterType `string`

dataSource.columns.advancedFilter.measure `string`

dataSource.columns.advancedFilter.values `array`

dataSource.columns.isNamedSets `boolean`

dataSource.columns.showSubTotal `boolean`

dataSource.columns.format `string`

dataSource.columns.formatString `string`

dataSource.columns.cssClass `string`

dataSource.columns.sortOrder `enum`

dataSource.columns.drilledItems `array`

dataSource.columns.filterItems `object`

dataSource.columns.filterItems.filterType `enum`

dataSource.columns.filterItems.values `array`

dataSource.rows `array`

dataSource.rows.fieldName `string`

dataSource.rows.fieldCaption `string`

dataSource.rows.advancedFilter `array`

dataSource.rows.advancedFilter.name `string`

dataSource.rows.advancedFilter.labelFilterOperator `string`

dataSource.rows.advancedFilter.valueFilterOperator `string`

dataSource.rows.advancedFilter.advancedFilterType `string`

dataSource.rows.advancedFilter.measure `string`

dataSource.rows.advancedFilter.values `array`

dataSource.rows.isNamedSets `boolean`

dataSource.rows.showSubTotal `boolean`

dataSource.rows.format `string`

dataSource.rows.formatString `string`

dataSource.rows.cssClass `string`

dataSource.rows.sortOrder `enum`

dataSource.rows.drilledItems `array`

dataSource.rows.filterItems `object`

dataSource.rows.filterItems.filterType `enum`

dataSource.rows.filterItems.values `array`

dataSource.values `array`

dataSource.values.fieldName `string`

dataSource.values.fieldCaption `string`

dataSource.values.measures `array`

dataSource.values.measures.fieldName `string`

dataSource.values.axis `string`

dataSource.values.isCalculatedField `boolean`

dataSource.values.summaryType `enum`

dataSource.values.format `string`

dataSource.values.formatString `string`

dataSource.values.cssClass `string`

dataSource.values.formula `string`

dataSource.filters `array`

dataSource.filters.fieldName `string`

dataSource.filters.fieldCaption `string`

dataSource.filters.filterItems `object`

dataSource.filters.filterItems.filterType `enum`

dataSource.filters.filterItems.values `array`

dataSource.cube `string`

dataSource.sourceInfo `string`

dataSource.providerName `string`

dataSource.data `object`

dataSource.catalog `string`

dataSource.enableAdvancedFilter `boolean`

dataSource.reportName `string`

dataSource.pagerOptions `object`

dataSource.pagerOptions.categoricalPageSize `number`