Ignite UI™ API Documentation

ui.igPivotDataSelector

Overview
Options
Events
Methods
Theming

igPivotDataSelector is an interactive UI control (jQuery UI widget) that enables users to select data slices, typically, when data is being visualized in an igPivotGrid™. It is a supplementary control working together with the data source components.

Code Sample

 
<!doctype html>
<html>
<head>
    <!-- Infragistics Combined CSS -->
    <link href="css/themes/infragistics/infragistics.theme.css" rel="stylesheet" type="text/css" />
    <link href="css/structure/infragistics.css" rel="stylesheet" type="text/css" />
    <!-- jQuery Core -->
    <script src="js/jquery.js" type="text/javascript"></script>
    <!-- jQuery UI -->
    <script src="js/jquery-ui.js" type="text/javascript"></script>
    <!-- Infragistics Combined Scripts -->
    <script src="js/infragistics.core.js" type="text/javascript"></script>
    <script src="js/infragistics.lob.js" type="text/javascript"></script>
    <script type="text/javascript">
        var data =
                [{ "ProductCategory": "Clothing", "UnitPrice": 12.81, "SellerName": "Stanley Brooker", "Country": "Bulgaria", "City": "Plovdiv", "Date": "01/01/2012", "UnitsSold": 282 },
                { "ProductCategory": "Clothing", "UnitPrice": 49.57, "SellerName": "Elisa Longbottom", "Country": "US", "City": "New York", "Date": "01/05/2013", "UnitsSold": 296 },
                { "ProductCategory": "Bikes", "UnitPrice": 3.56, "SellerName": "Lydia Burson", "Country": "Uruguay", "City": "Ciudad de la Costa", "Date": "01/06/2011", "UnitsSold": 68 },
                { "ProductCategory": "Accessories", "UnitPrice": 85.58, "SellerName": "David Haley", "Country": "UK", "City": "London", "Date": "04/07/2012", "UnitsSold": 293 },
                { "ProductCategory": "Components", "UnitPrice": 18.13, "SellerName": "John Smith", "Country": "Japan", "City": "Yokohama", "Date": "12/08/2012", "UnitsSold": 240 },
                { "ProductCategory": "Clothing", "UnitPrice": 68.33, "SellerName": "Larry Lieb", "Country": "Uruguay", "City": "Ciudad de la Costa", "Date": "05/12/2011", "UnitsSold": 456 },
                { "ProductCategory": "Components", "UnitPrice": 16.05, "SellerName": "Walter Pang", "Country": "Bulgaria", "City": "Sofia", "Date": "02/19/2013", "UnitsSold": 492 }];

        $(function () {
            $('#dataSelector').igPivotDataSelector({
                dataSourceOptions: {
                    flatDataOptions:
                        {
                            dataSource: data,
                            metadata: {
                                cube: {
                                    name: "Sales",
                                    caption: "Sales",
                                    measuresDimension: {
                                        caption: "Measures",
                                        measures: [ //for each measure, name and aggregator are required
                                            {
                                                caption: "Units Sold", name: "UnitsSold",
                                                // returns a function that will be used as sum aggregatro on the 'UnitsSold property' of the data objects
                                                aggregator: $.ig.OlapUtilities.prototype.sumAggregator('UnitsSold')
                                            }]
                                    },
                                    dimensions: [ // for each dimension name and hierarchies are required
                                        {
                                            caption: "Seller", name: "Seller", hierarchies: [{
                                                caption: "Seller", name: "Seller", levels: [
                                                    {
                                                        name: "AllSellers", caption: "All Sellers",
                                                        memberProvider: function (item) { return "All Sellers"; }
                                                    },
                                                    {
                                                        name: "SellerName", caption: "Seller",
                                                        memberProvider: function (item) { return item.SellerName; }
                                                    }]
                                            }]
                                        },
                                        {
                                            caption: "Date", name: "Date", /*displayFolder: "Folder1\\Folder2",*/ hierarchies: [
                                                $.ig.OlapUtilities.prototype.getDateHierarchy(
                                                    "Date", // the source property name
                                                    ["year", "quarter", "month", "date"], // the date parts for which levels will be generated (optional)
                                                    "Dates", // The name for the hierarchy (optional)
                                                    "Date", // The caption for the hierarchy (optional)
                                                    ["Year", "Quarter", "Month", "Day"], // the captions for the levels (optional)
                                                    "All Periods") // the root level caption (optional)
                                            ]
                                        }
                                    ]
                                }
                            }
                        },
                    // Preload hiearhies for the rows, columns, filters and measures
                    rows: "[Date].[Dates]",
                    columns: "[Seller].[Seller]",
                    measures: "[Measures].[UnitsSold]"
                }
            });
        });
    </script>
</head>
<body>
    <div id="dataSelector"></div>
</body>
</html>

Related Samples

customMoveValidation

Type:: function
Default:: null

A function that will be called to determine if an item can be moved in or dropped on an area of the data selector.

paramType="string" The location where the item will be moved - igPivotGrid, igPivotDataSelector, filters, rows, columns or measures.
paramType="string" The type of the item - Hierarchy, Measure or MeasureList.
paramType="string" The unique name of the item.
returnType="bool" The function must return true if the item should be accepted.

Code Sample

 
				//Initialize
				$(".selector").igPivotDataSelector({
					customMoveValidation : function(location, itemType, uniqueName) {
						// disable moving of any element to the columns
						if (location == 'columns') {
							return false;
						}
						// if the current item is a hierarchy containing the word "Seller" in its uniqueName, disable the move
						if (itemType == 'Hierarchy'
							&& uniqueName.indexOf("Seller") !== -1) {
							return false;
						}

						// in all other cases allow the move
						return true;
					}
				});

				//Get
				var customValidation = $(".selector").igPivotDataSelector("option", "customMoveValidation");

				//Set
				$(".selector").igPivotDataSelector("option", "customMoveValidation", validationFunc);

dataSource

Type:: object
Default:: null

An instance of $.ig.OlapXmlaDataSource or $.ig.OlapFlatDataSource.

Code Sample

 
			//Initialize
			$(".selector").igPivotDataSelector({
				dataSource : ds
			});

			//Get
			var dataSource = $(".selector").igPivotDataSelector("option", "dataSource");

			//Set
			$(".selector").igPivotDataSelector("option", "dataSource", ds);

dataSourceOptions

Type:

object

Default:

{}
An object that will be used to create an instance of $.ig.OlapXmlaDataSource or $.ig.OlapFlatDataSource.
The provided value must contain an object with settings for one of the data source types - xmlaOptions or flatDataOptions.
Code Sample
```
 
			//Initialize
		$(".selector").igPivotDataSelector({
			dataSourceOptions: {
				flatDataOptions:
					{
						[{ "ProductCategory": "Clothing", "UnitPrice": 12.81, "SellerName": "Stanley Brooker", "Country": "Bulgaria", "City": "Plovdiv", "Date": "01/01/2012", "UnitsSold": 282 },
						{ "ProductCategory": "Clothing", "UnitPrice": 49.57, "SellerName": "Elisa Longbottom", "Country": "US", "City": "New York", "Date": "01/05/2013", "UnitsSold": 296 },
						{ "ProductCategory": "Bikes", "UnitPrice": 3.56, "SellerName": "Lydia Burson", "Country": "Uruguay", "City": "Ciudad de la Costa", "Date": "01/06/2011", "UnitsSold": 68 },
						{ "ProductCategory": "Accessories", "UnitPrice": 85.58, "SellerName": "David Haley", "Country": "UK", "City": "London", "Date": "04/07/2012", "UnitsSold": 293 },
						{ "ProductCategory": "Components", "UnitPrice": 18.13, "SellerName": "John Smith", "Country": "Japan", "City": "Yokohama", "Date": "12/08/2012", "UnitsSold": 240 },
						{ "ProductCategory": "Clothing", "UnitPrice": 68.33, "SellerName": "Larry Lieb", "Country": "Uruguay", "City": "Ciudad de la Costa", "Date": "05/12/2011", "UnitsSold": 456 },
						{ "ProductCategory": "Components", "UnitPrice": 16.05, "SellerName": "Walter Pang", "Country": "Bulgaria", "City": "Sofia", "Date": "02/19/2013", "UnitsSold": 492 }],
						metadata: {
							cube: {
								name: "Sales",
								caption: "Sales",
								measuresDimension: {
									caption: "Measures",
									measures: [ //for each measure, name and aggregator are required
										{ caption: "UnitsSold", name: "UnitsSold", aggregator: $.ig.OlapUtilities.prototype.sumAggregator('UnitsSold') }]
								},
								dimensions: [ // for each dimension name and hierarchies are required
									{
										caption: "Seller", name: "Seller", hierarchies: [{
											caption: "Seller", name: "Seller", levels: [
												{
													name: "AllSellers", caption: "All Sellers",
													memberProvider: function (item) { return "All Sellers"; }
												},
												{
													name: "SellerName", caption: "Seller",
													memberProvider: function (item) { return item.SellerName; }
												}]
										}]
									},
									{
										caption: "Date", name: "Date", hierarchies: [
											$.ig.OlapUtilities.prototype.getDateHierarchy(
												"Date", // the source property name
												["year", "quarter", "month", "date"], // the date parts for which levels will be generated (optional)
												"Dates", // The name for the hierarchy (optional)
												"Date", // The caption for the hierarchy (optional)
												["Year", "Quarter", "Month", "Day"], // the captions for the levels (optional)
												"AllPeriods") // the root level caption (optional)
										]
									}
								]
							}
						}
					},
				// Preload hiearhies for the rows, columns, filters and measures
				rows: "[Date].[Dates]",
				columns: "[Seller].[Seller]",
				measures: "[Measures].[UnitsSold]"
			}
		});

		//Get
		$(".selector").igPivotDataSelector("option", "dataSourceOptions");

		//Set
		$(".selector").igPivotDataSelector("option", "dataSourceOptions", dataOptions);
			 
```
- columns
  
  Type:
  
  string
  
  Default:
  
  null
  
  A list of hierarchy names separated by comma (,). These will be the hierarchies in the columns of the data source.
- filters
  
  Type:
  
  string
  
  Default:
  
  null
  
  A list of hierarchy names separated by comma (,). These will be hierarchies in the filters of the data source.
- flatDataOptions
  
  Type:
  
  object
  
  Default:
  
  {}
  Settings for creating an instance of $.ig.OlapFlatDataSource.
  - dataSource
    
    Type:
    
    object
    
    Default:
    
    null
    
    Specifies any valid data source accepted by $.ig.DataSource, or an instance of an $.ig.DataSource itself.
  - dataSourceType
    
    Type:
    
    string
    
    Default:
    
    null
    
    Explicitly set data source type (such as "json"). Please refer to the documentation of $.ig.DataSource and its type property.
  - dataSourceUrl
    
    Type:
    
    string
    
    Default:
    
    null
    
    Specifies a remote URL accepted by $.ig.DataSource in order to request data from it.
  - metadata
    
    Type:
    
    object
    
    Default:
    
    {}
    
    Optional="false" An object containing processing instructions for the $.ig.DataSource data.
    
    cube
    
    Type:
    
    object
    
    Default:
    
    {}
    
    Optional="false" Metadata used for the creation of the cube.
    
    caption
    
    Type:
    
    string
    
    Default:
    
    null
    
    A caption for the cube.
    
    dimensions
    
    Type:
    
    array
    
    Default:
    
    []
    
    Elements Type:
    
    object
    
    An array of dimension metadata objects.
    
    caption
    
    Type:
    
    string
    
    Default:
    
    null
    
    A caption for the dimension.
    
    hierarchies
    
    Type:
    
    array
    
    Default:
    
    []
    
    Elements Type:
    
    object
    
    An array of hierarchy metadata objects.
    
    caption
    
    Type:
    
    string
    
    Default:
    
    null
    
    A caption for the hierarchy.
    
    displayFolder
    
    Type:
    
    string
    
    Default:
    
    null
    
    The path to be used when displaying the hierarchy in the user interface.
    Nested folders are indicated by a backslash (\).
    The folder hierarchy will appear under parent dimension node.
    
    levels
    
    Type:
    
    array
    
    Default:
    
    []
    
    Elements Type:
    
    object
    
    An array of level metadata objects.
    
    caption
    
    Type:
    
    string
    
    Default:
    
    null
    
    A caption for the level.
    
    memberProvider
    
    Type:
    
    function
    
    Default:
    
    null
    
    A function called for each item of the data source array when level members are created.
    Based on the item parameter the function should return a value that will form the $.ig.Member’s name and caption.
    
    name
    
    Type:
    
    string
    
    Default:
    
    null
    
    Optional="false" A name for the level.
    The unique name of the level is formed using the following pattern:
    {<hierarchy.uniqueName>}.[<levelMetadata.name>].
    
    name
    
    Type:
    
    string
    
    Default:
    
    null
    
    Optional="false" A name for the hierarchy.
    The unique name of the hierarchy is formed using the following pattern:
    [<parentDimension.name>].[<hierarchyMetadata.name>].
    
    name
    
    Type:
    
    string
    
    Default:
    
    null
    
    Optional="false" A unique name for the dimension.
    
    measuresDimension
    
    Type:
    
    object
    
    Default:
    
    {}
    
    An object providing information about the measures' root node.
    
    caption
    
    Type:
    
    string
    
    Default:
    
    null
    
    A caption for the measures dimension.
    The default value is "Measures".
    
    measures
    
    Type:
    
    array
    
    Default:
    
    []
    
    Elements Type:
    
    object
    
    An array of measure metadata objects.
    
    aggregator
    
    Type:
    
    function
    
    Default:
    
    null
    
    Optional="false" An aggregator function called when each cell is evaluated.
    Returns a value for the cell. If the returned value is null, no cell will be created in for the data source result.
    
    caption
    
    Type:
    
    string
    
    Default:
    
    null
    
    A caption for the measure.
    
    displayFolder
    
    Type:
    
    string
    
    Default:
    
    null
    
    The path used when displaying the measure in the user interface. Nested folders are indicated by a backslash (\).
    
    name
    
    Type:
    
    string
    
    Default:
    
    null
    
    Optional="false" A unique name for the measure.
    
    name
    
    Type:
    
    string
    
    Default:
    
    null
    
    A unique name for the measures dimension.
    The default value is "Measures". This name is used to create the names of dimensions using the following pattern:
    [<measuresDimensionMetadata.name>].[<measureMetadata.name>].
    
    name
    
    Type:
    
    string
    
    Default:
    
    null
    
    Optional="false" A unique name for the cube.
  - responseDataKey
    
    Type:
    
    string
    
    Default:
    
    null
    
    See $.ig.DataSource.
    string Specifies the name of the property in which data records are held if the response is wrapped.
    null Option is ignored.
  - responseDataType
    
    Type:
    
    string
    
    Default:
    
    null
    
    String Explicitly set data source type (such as "json"). Please refer to the documentation of $.ig.DataSource and its type property.
    null Option is ignored.
- measures
  
  Type:
  
  string
  
  Default:
  
  null
  
  A list of measure names separated by comma (,). These will be the measures of the data source.
- rows
  
  Type:
  
  string
  
  Default:
  
  null
  
  A list of hierarchy names separated by comma (,). These will be the hierarchies in the rows of the data source.
- xmlaOptions
  
  Type:
  
  object
  
  Default:
  
  {}
  Settings for creating an instance of $.ig.OlapXmlaDataSource.
  - catalog
    
    Type:
    
    string
    
    Default:
    
    null
    
    The catalog name.
  - cube
    
    Type:
    
    string
    
    Default:
    
    null
    
    The name of the cube in the data source.
  - discoverProperties
    
    Type:
    
    object
    
    Default:
    
    null
    
    Additional properties sent with every discover request.
    The object is treated as a key/value store where each property name is used as the key and the property value as the value.
  - enableResultCache
    
    Type:
    
    bool
    
    Default:
    
    true
    
    Enables/disables caching of the XMLA result object.
  - executeProperties
    
    Type:
    
    object
    
    Default:
    
    null
    
    Additional properties sent with every execute request.
    The object is treated as a key/value store where each property name is used as the key and the property value as the value.
  - mdxSettings
    
    Type:
    
    object
    
    Default:
    
    {}
    
    Optional="true" a javascript object containing information about how the request to the xmla server should be processed.
    
    addCalculatedMembersOnColumns
    
    Type:
    
    bool
    
    Default:
    
    true
    
    Optional="true" a value indicating whether a members' set expressions on COLUMNS axis should be wrapped with AddCalculatedMembers MDX method. Default value is true.
    
    addCalculatedMembersOnRows
    
    Type:
    
    bool
    
    Default:
    
    true
    
    Optional="true" a value indicating whether a members' set expressions on ROWS axis should be wrapped with AddCalculatedMembers MDX method. Default value is true.
    
    dimensionPropertiesOnColumns
    
    Type:
    
    array
    
    Default:
    
    []
    
    Elements Type:
    
    object
    
    Optional="true" a string array with the names of intrinsic non-context sensitive member properties applied on COLUMNS axis. By defult CHILDREN_CARDINALITY and PARENT_UNIQUE_NAME properties are always added to DIMENSION PROPERTIES.
    
    dimensionPropertiesOnRows
    
    Type:
    
    array
    
    Default:
    
    []
    
    Elements Type:
    
    object
    
    Optional="true" a string array with the names of intrinsic non-context sensitive member properties applied on ROWS axis. By defult CHILDREN_CARDINALITY and PARENT_UNIQUE_NAME properties are always added to DIMENSION PROPERTIES.
    
    nonEmptyOnColumns
    
    Type:
    
    bool
    
    Default:
    
    true
    
    Optional="true" a value indicating whether a NON EMPTY clause is present on COLUMNS axis. Default value is true.
    
    nonEmptyOnRows
    
    Type:
    
    bool
    
    Default:
    
    true
    
    Optional="true" a value indicating whether a NON EMPTY clause is present on ROWS axis. Default value is true.
  - measureGroup
    
    Type:
    
    string
    
    Default:
    
    null
    
    The name of the measure group in the data source.
  - requestOptions
    
    Type:
    
    object
    
    Default:
    
    {}
    
    An object containing information about how the request to the XMLA server should be processed.
    
    beforeSend
    
    Type:
    
    function
    
    Default:
    
    null
    
    A callback to be invoked right before the request is send to the server. Extends beforeSend callback of jQuery.ajax’s options object.
    
    withCredentials
    
    Type:
    
    bool
    
    Default:
    
    false
    
    The value is applied to XmlHttpRequest.withCredentials if supported by the user agent.
    Setting this property to true will allow IE8/IE9 to make authenticated cross-origin requests to tusted domains through XmlHttpRequest instead of XDomainRequest
    and will prompt the user for credentials.
  - serverUrl
    
    Type:
    
    string
    
    Default:
    
    null
    
    Optional="false" The URL of the XMLA server.

deferUpdate

Type:: bool
Default:: false

Setting deferUpdate to true will not apply changes to the data source until the update method is called or the update layout button is clicked.

Code Sample

 
			//Initialize
			$(".selector").igPivotDataSelector({
				deferUpdate : true
			});

			//Get
			var deferUpdate = $(".selector").igPivotDataSelector("option", "deferUpdate");

			//Set
			$(".selector").igPivotDataSelector("option", "deferUpdate", true);

disableColumnsDropArea

Type:: bool
Default:: false

Disable the drag and drop for the columns drop area and the ability to use filtering and remove items from it.

Code Sample

 
			//Initialize
			$('.selector').igPivotDataSelector({
				disableColumnsDropArea : true
			});

			//Get
			var disableColumnsDropArea = $(".selector").igPivotDataSelector("option", "disableColumnsDropArea");

			//Set
			$(".selector").igPivotDataSelector("option", "disableColumnsDropArea", true);

disableFiltersDropArea

Type:: bool
Default:: false

Disable the drag and drop for the filters drop area and the ability to use filtering and remove items from it.

Code Sample

 
			//Initialize
			$('.selector').igPivotDataSelector({
				disableFiltersDropArea : true
			});

			//Get
			var disableFiltersDropArea = $(".selector").igPivotDataSelector("option", "disableFiltersDropArea");

			//Set
			$(".selector").igPivotDataSelector("option", "disableFiltersDropArea", true);

disableMeasuresDropArea

Type:: bool
Default:: false

Disable the drag and drop for the measures drop area and the ability to use filtering and remove items from it.

Code Sample

 
			//Initialize
			$('.selector').igPivotDataSelector({
				disableMeasuresDropArea : true
			});

			//Get
			var disableMeasuresDropArea = $(".selector").igPivotDataSelector("option", "disableMeasuresDropArea");

			//Set
			$(".selector").igPivotDataSelector("option", "disableMeasuresDropArea", true);

disableRowsDropArea

Type:: bool
Default:: false

Disable the drag and drop for the rows drop area and the ability to use filtering and remove items from it.

Code Sample

 
			//Initialize
			$('.selector').igPivotDataSelector({
				disableRowsDropArea : true
			});

			//Get
			var disableRowsDropArea = $(".selector").igPivotDataSelector("option", "disableRowsDropArea");

			//Set
			$(".selector").igPivotDataSelector("option", "disableRowsDropArea", true);

dragAndDropSettings

Type:

object

Default:

{}
Settings for the drag and drop functionality of the igPivotDataSelector.
Code Sample
```
 
			//Initialize
			$(".selector").igPivotDataSelector({
				dragAndDropSettings : {
					appendTo : $("element"),
					containment : true,
					zIndex : 10
				}
			});

			//Get
			var dragAndDropSettings = $(".selector").igPivotDataSelector("option", "dragAndDropSettings");

			//Set
			$(".selector").igPivotDataSelector("option", "dragAndDropSettings", settings );
			 
```
- appendTo
  
  Type:
  
  enumeration
  
  Default:
  
  body
  
  Which element the draggable helper should be appended to while dragging.
- containment
  
  Type:
  
  enumeration
  
  Default:
  
  false
  
  Specifies the containment for the drag helper. The area inside of which the helper is contained would be scrollable while dragging.
- zIndex
  
  Type:
  
  number
  
  Default:
  
  10
  
  Specifies z-index that would be set for the drag helper.
dropDownParent

Type:

enumeration

Default:

body

Specifies the parent for the drop downs.
height

Type:

enumeration

Default:

null
This is the total height of the grid, including all UI elements - scroll container with data rows, header, footer, filter row - (if any), etc.
Members
- string
- Type:string
- The widget height can be set in pixels (px) and percentage (%).
- number
- Type:number
- The widget height can be set as a number.
- null
- Type:object
- will stretch vertically to fit data, if no other heights are defined.
Code Sample
```
 
				//Initialize
				$('.selector').igPivotDataSelector({
					height : "600px"
				});
				//Get
				$(".selector").igPivotDataSelector("option", "height");
				//Set
				$(".selector").igPivotDataSelector("option", "height", "600px");
				 
```

language
Inherited

Type:: string
Default:: "en"

Set/Get the locale language setting for the widget.

Code Sample

 
					//Initialize
				$(".selector").igPivotDataSelector({
					language: "ja"
				});

				// Get
				var language = $(".selector").igPivotDataSelector("option", "language");

				// Set
				$(".selector").igPivotDataSelector("option", "language", "ja");

locale
Inherited

Type:: object
Default:: null

Set/Get the locale setting for the widget.

Code Sample

 
					//Initialize
				$(".selector").igPivotDataSelector({
					locale: {}
				});

				// Get
				var locale = $(".selector").igPivotDataSelector("option", "locale");

				// Set
				$(".selector").igPivotDataSelector("option", "locale", {});

regional
Inherited

Type:: enumeration
Default:: defaults

Set/Get the regional setting for the widget.

Code Sample

 
				//Initialize
				$(".selector").igPivotDataSelector({
					regional: "ja"
				});
				// Get
				var regional = $(".selector").igPivotDataSelector("option", "regional");
				// Set
				$(".selector").igPivotDataSelector("option", "regional", "ja");

width

Type:

enumeration

Default:

250
.
Members
- string
- Type:string
- The widget width can be set in pixels (px) and percentage (%). The recommended width is 250px.
- number
- Type:number
- The widget width can be set as a number.
- null
- Type:object
- will stretch to fit data, if no other widths are defined.
Code Sample
```
 
				//Initialize
				$('.selector').igPivotDataSelector({
					width : "300px"
				});
				//Get
				$(".selector").igPivotDataSelector("option", "width");
				//Set
				$(".selector").igPivotDataSelector("option", "width", "300px");
				 
```

For more information on how to interact with the Ignite UI controls' events, refer to
Using Events in Ignite UI.

Note: Calling API methods programmatically does not raise events related to their operation unless specifically stated otherwise by the corresponding API documentation; those events are only raised by their respective user interaction.

Show Details

dataSelectorRendered

Cancellable:: false

Fired after the data selector is rendered. Changing the data source instance will re-render the data selector.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectordataselectorrendered", ".selector", function (evt, ui) {
				//return reference to igPivotDataSelector
				ui.owner;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				dataSelectorRendered: function(evt, ui) {...}
				});

dataSourceInitialized

Cancellable:: false

Fired after the data source has initialized.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectordatasourceinitialized", ".selector", function (evt, ui) {
				//return reference to the data source
				ui.dataSource;
				//return a bool idicating whether an error has occured during initialization
				ui.error;
				//return a reference to the root of the data source metatadata root item
				ui.metadataTreeRoot;
				//return reference to igPivotDataSelector
				ui.owner;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				dataSourceInitialized: function(evt, ui) {...}
				});

dataSourceUpdated

Cancellable:: false

Fired after the data source has updated.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectordatasourceupdated", ".selector", function (evt, ui) {
				//return reference to the data source
				ui.dataSource;
				//return a bool idicating whether an error has occured during initialization
				ui.error;
				//return a reference to result of the update operation
				ui.result;
				//return reference to igPivotDataSelector
				ui.owner;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				dataSourceUpdated: function(evt, ui) {...}
				});

deferUpdateChanged

Cancellable:: false

Fired when the defer update checkbox changes.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectordeferupdatechanged", ".selector", function (evt, ui) {
				//return the value of the deferUpdate option
				ui.deferUpdate;
				//return reference to igPivotDataSelector
				ui.owner;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				deferUpdateChanged: function(evt, ui) {...}
				});

drag

Cancellable:: true

Fired on drag. Return false to cancel the dragging.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectordrag", ".selector", function (evt, ui) {
				//return a reference to the helper
				ui.helper;
				//return a reference to the offset
				ui.offset;
				//return a reference to the original position of the draggable element
				ui.originalPosition;
				//return a reference to the current position of the draggable element
				ui.position;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				drag: function(evt, ui) {...}
				});

dragStart

Cancellable:: true

Fired on drag start. Return false to cancel the drag.

ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectordragstart", ".selector", function (evt, ui) {
				//return a reference to the data
				ui.metadata;
				//return a reference to the helper
				ui.helper;
				//return a reference to the offset
				ui.offset;
				//return a reference to the original position of the draggable element
				ui.originalPosition;
				//return a reference to the current position of the draggable element
				ui.position;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				dragStart: function(evt, ui) {...}
				});

dragStop

Cancellable:: false

Fired on drag stop.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectordragstop", ".selector", function (evt, ui) {
				//return a reference to the helper
				ui.helper;
				//return a reference to the offset
				ui.offset;
				//return a reference to the original position of the draggable element
				ui.originalPosition;
				//return a reference to the current position of the draggable element
				ui.position;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				dragStop: function(evt, ui) {...}
				});

filterDropDownClosed

Cancellable:: false

Fired after the filter members drop down closes.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectorfilterdropdownclosed", ".selector", function (evt, ui) {
				//return a reference to the hierarchy
				ui.hierarchy;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				filterDropDownClosed: function(evt, ui) {...}
				});

filterDropDownClosing

Cancellable:: true

Fired before the filter members drop down closes. Return false to cancel the closing.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectorfilterdropdownclosing", ".selector", function (evt, ui) {
				//return a reference to the drop down
				ui.dropDownElement;
				//return a reference to the hierarchy
				ui.hierarchy;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				filterDropDownClosing: function(evt, ui) {...}
				});

filterDropDownOk

Cancellable:: true

Fired after the OK button in the filter members drop down is clicked. Return false to cancel the applying of the filters.

ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectorfilterdropdownok", ".selector", function (evt, ui) {
				//return a reference to the drop down
				ui.dropDownElement;
				//return the collection with the selected filter members. If all filter members are selected, the collection will be empty.
				ui.filterMembers;
				//return a reference to the hierarchy
				ui.hierarchy;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				filterDropDownOk: function(evt, ui) {...}
				});

filterDropDownOpened

Cancellable:: false

Fired after the filter members drop down opens.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectorfilterdropdownopened", ".selector", function (evt, ui) {
				//return a reference to the drop down
				ui.dropDownElement;
				//return a reference to the hierarchy
				ui.hierarchy;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				filterDropDownOpened: function(evt, ui) {...}
				});

filterDropDownOpening

Cancellable:: true

Fired before the filter members drop down opens. Return false to cancel the opening.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectorfilterdropdownopening", ".selector", function (evt, ui) {
				//return a reference to the hierarchy
				ui.hierarchy;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				filterDropDownOpening: function(evt, ui) {...}
				});

filterMembersLoaded
Deprecated

Cancellable:: false

Fired after the filter members are loaded.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectorfiltermembersloaded", ".selector", function (evt, ui) {
				//return the collection with the root filter members
				ui.parent;
				//return the collection with the newly loaded filter members
				ui.rootFilterMembers;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				filterMembersLoaded: function(evt, ui) {...}
				});

metadataDropped

Cancellable:: false

Fired after a metadata item drop.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectormetadatadropped", ".selector", function (evt, ui) {
				//return a reference to the dragged element
				ui.draggedElement;
				//return a reference to the drop target
				ui.targetElement;
				//return a reference to the data
				ui.metadata;
				//return the index at which the metadata is inserted
				ui.metadataIndex;
				//return a reference to the helper
				ui.helper;
				//return a reference to the offset
				ui.offset;
				//return a reference to the current position of the draggable element
				ui.position;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				metadataDropped: function(evt, ui) {...}
				});

metadataDropping

Cancellable:: true

Fired before a metadata item drop. Return false to cancel the drop.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectormetadatadropping", ".selector", function (evt, ui) {
				//return a reference to the dragged element
				ui.draggedElement;
				//return a reference to the drop target
				ui.targetElement;
				//return a reference to the data
				ui.metadata;
				//return the index at which the metadata is inserted
				ui.metadataIndex;
				//return a reference to the helper
				ui.helper;
				//return a reference to the offset
				ui.offset;
				//return a reference to the current position of the draggable element
				ui.position;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				metadataDropping: function(evt, ui) {...}
				});

metadataRemoved

Cancellable:: false

Fired after a metadata item is removed when the user clicks the close icon.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectormetadataremoved", ".selector", function (evt, ui) {
				//return a reference to the data
				ui.metadata;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				metadataRemoved: function(evt, ui) {...}
				});

metadataRemoving

Cancellable:: true

Fired before a metadata item is removed when the user clicks the close icon. Return false to cancel the removing.

evt
Type: Event

JQuery event object.
ui
Type: Object

Code Sample

 
				//Bind after initialization
				$(document).on("igpivotdataselectormetadataremoving", ".selector", function (evt, ui) {
				//return a reference to the drop target
				ui.targetElement;
				//return a reference to the data
				ui.metadata;
				});

				//Initialize
				$(".selector").igPivotDataSelector({
				metadataRemoving: function(evt, ui) {...}
				})

Show Details

changeGlobalLanguage
Inherited

.igPivotDataSelector( "changeGlobalLanguage" );
Changes the widget language to global language. Global language is the value in $.ig.util.language.
Code Sample
```
 
				$(".selector").igPivotDataSelector("changeGlobalLanguage");
			 
```
changeGlobalRegional
Inherited

.igPivotDataSelector( "changeGlobalRegional" );
Changes the widget regional settins to global regional settings. Global regional settings are container in $.ig.util.regional.
Code Sample
```
 
				$(".selector").igPivotDataSelector("changeGlobalRegional");
			 
```
changeLocale

.igPivotDataSelector( "changeLocale" );
Changes the all locales into the widget element to the language specified in options.language
Note that this method is for rare scenarios, see language or locale option setter.
Code Sample
```
 
				$(".selector").igPivotDataSelector("changeLocale");
			 
```
destroy

.igPivotDataSelector( "destroy" );
Destroy is part of the jQuery UI widget API and does the following:
1. Remove custom CSS classes that were added.
2. Unwrap any wrapping elements such as scrolling divs and other containers.
3. Unbind all events that were bound.
Code Sample
```
 
				$(".selector").igPivotDataSelector("destroy");
				 
```
update

.igPivotDataSelector( "update" );
Updates the data source.
Code Sample
```
 
			$(".selector").igPivotDataSelector("update");
			 
```

active

Class applied to the drop areas, which can accept a drop.
ui-igpivotdataselector-catalog

Class applied to the catalog combo.
ui-icon ui-icon-pivot-columns

Classes applied to the columns drop area icon.
ui-igpivotdataselector-cube

Class applied to the cube combo.
ui-igpivotdataselector

Class applied to the the data selector element.
ui-igpivotdataselector-root

Class applied to the root container for the data selector.
ui-igpivot-droparea ui-widget-content

Classes applied to the drop areas.
ui-igpivotdataselector-dropareas

Class applied to the table with the drop areas.
ui-state-highlight

Class applied to the valid drop element.
ui-igpivot-filterdropdown ui-widget ui-widget-content

Classes applied to the filters drop down element.
ui-icon ui-icon-pivot-smallfilter ui-icon-carat-1-s

Classes applied to the filter icon in the metadata items.
ui-igpivot-filtermembers

Class applied to the tree containing the filter members.
ui-icon ui-icon-pivot-filters

Classes applied to the filters drop area icon.
ui-igpivot-insertitem ui-state-highlight ui-corner-all

Classes applied to the insert item indicator in the drop areas.
ui-state-error

Class applied to the invalid drop element.
ui-igpivotdataselector-measuregroup

Class applied to the measure group combo.
ui-icon ui-icon-pivot-measures

Classes applied to the measures drop area icon.
ui-igpivotdataselector-metadata ui-widget-content

Classes applied to the metadata tree.
ui-igpivot-metadataitem ui-widget ui-corner-all ui-state-default

Classes applied to the elements representing metadata items - in the metadata tree and the drop areas.
ui-igpivot-metadatadropdown ui-widget ui-widget-content

Classes applied to the metadata item drop down element.
ui-icon ui-icon-pivot-rows

Classes applied to the rows drop area icon.
ui-igpivotdataselector-updatelayout

Class applied to the update layout button.

Ignite UI | Samples

ui.igPivotDataSelector

Code Sample

Related Samples

Related Topics

Dependencies

Inherits

customMoveValidation

Code Sample

dataSource

Code Sample

dataSourceOptions

Code Sample

columns

filters

flatDataOptions

dataSource

dataSourceType

dataSourceUrl

metadata

cube

caption

dimensions

caption

hierarchies

caption

displayFolder

levels

caption

memberProvider

name

name

name

measuresDimension

caption

measures

aggregator

caption

displayFolder

name

name

name

responseDataKey

responseDataType

measures

rows

xmlaOptions

catalog

cube

discoverProperties

enableResultCache

executeProperties

mdxSettings

addCalculatedMembersOnColumns

addCalculatedMembersOnRows

dimensionPropertiesOnColumns

dimensionPropertiesOnRows

nonEmptyOnColumns

nonEmptyOnRows

measureGroup

requestOptions

beforeSend

withCredentials

serverUrl

deferUpdate

Code Sample

disableColumnsDropArea

Code Sample

disableFiltersDropArea

Code Sample

disableMeasuresDropArea

Code Sample

disableRowsDropArea

Code Sample

dragAndDropSettings

Code Sample

appendTo

containment

zIndex

dropDownParent

language
Inherited

locale
Inherited

regional
Inherited

filterMembersLoaded
Deprecated

changeGlobalLanguage
Inherited

changeGlobalRegional
Inherited