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.

    Default Value: “FilterElement”

    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 });

    Methods

    doAjaxPost()

    Performs an asynchronous HTTP (AJAX) request.

    Example:

  • JAVASCRIPT
  • var clientObj = $("#PivotClient1").data("ejPivotClient");
        clientObj.doAjaxPost("POST", "/OlapService/Initialize", { "key", "Hello World" }, "renderControlSuccess", null);

    doPostBack()

    Performs an asynchronous HTTP (full post) submit.

    Example:

  • JAVASCRIPT
  • var clientObj = $("#PivotClient1").data("ejPivotClient");
        clientObj.doPostBack("/OlapService/Initialize", { "key", "Hello World" });

    refreshPagedPivotClient()

    Navigates to a specified page in the specified axis.

    Example:

  • JAVASCRIPT
  • var clientObj = $("#PivotClient1").data("ejPivotClient");
        clientObj.refreshPagedPivotClient("series", 24);//Loads the 24th page in series axis

    refreshPagedPivotClientSuccess()

    Updates the pivot client component with the JSON data that is fetched from the service while navigating between the pages.

    Example:

  • JAVASCRIPT
  • var clientObj = $("#PivotClient1").data("ejPivotClient");
        clientObj.refreshPagedPivotClientSuccess(jsonData); //jsonData object holds the JSON data required to render a specific page of the control.

    generateJSON()

    Renders the pivot chart and the pivot grid with the provided JSON data.

    Example:

  • JAVASCRIPT
  • 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) { }
        });