Infragistics(R) IgniteUI
Adding igPivotDataSelector to an ASP.NET MVC Application
E-mail your feedback on this topic.

Glossary Item Box

Topic Overview

Purpose

This topic explains, in both conceptual and step-by-step form, how to add the igPivotDataSelector™ control to an ASP.NET MVC application using the ASP.NET MVC helper.

Required background

The following topics are prerequisites to understanding this topic:

Topic

Purpose

igPivotDataSelector Overview

This topic provides conceptual information about the igPivotDataSelector control including its main features, minimum requirements, and user functionality.

Adding igPivotDataSelector to an HTML Page

This topic explains, in both conceptual and step-by-step form, how to add the igPivotDataSelector control to an HTML page. This topic provides the complete listing of the required JavaScript resource files.


In this topic


Adding igPivotDataSelector to an ASP.NET MVC Application – Conceptual Overview

Adding igPivotDataSelector to an ASP.NET MVC application summary

The igPivotDataSelector is a client-side component accompanied by an ASP.NET MVC helper that allows the component to be used in the CS/VB code of an MVC View. It allows also consuming data from the View’s Model (using igOlapFlatDataSource). When using the ASP.NET MVC helper for the igPivotDataSelector, there are two ways to bind it to data:

  • By configuring a data source.

This is done by setting the required DataSourceOptions (used to create a data source object). This approach is explained in this topic.

  • By referencing a pre-configured data source.

This is done by providing the ID of a pre-configured data source instance (DataSourceID) (as explained in Adding igOlapXmlaDataSource to an ASP.NET MVC Application and Adding igOlapFlatDataSource to an ASP.NET MVC Application).

Defining the igPivotDataSelector in the View is achieved by setting the required properties using methods that always return the same object that called them. This allows chaining syntax to be used for setting all required properties. For complex objects such as DataSourceOptions, lambda expression builders are used in order to achieve this kind of syntax.

Requirements

Following are the general requirements for adding igPivotDataSelector to an ASP.NET MVC application:

Steps

Following are the general conceptual steps for adding igPivotDataSelector to an ASP.NET MVC application.

1. Adding a reference to the Infragistics namespace
2. Adding a reference to the required JavaScript resources

3. Adding the igPivotDataSelector and configuring the data source


Adding igPivotDataSelector to an ASP.NET MVC Application – Example

Introduction

The procedure below demonstrates how to add the igPivotDataSelector control to an ASP.NET MVC application. Code examples for both approaches for adding igPivotDataSelector – by setting the DataSourceOptions and by setting the DataSourceID, are available. The required resources in this example are referred to automatically with the Infragistics Loader.

Preview

The following screenshot is a preview of the final result.

Prerequisites

To complete the procedure, you need the following:

  • An ASP.NET MVC application
  • Reference to the Infragistics.Web.Mvc.dll assembly added to the application project
  • The Adventure Works sample database deployed on an SQL server (http://sampledata.infragistics.com is used in this example)

Steps

The following steps demonstrate how to add an igPivotDataSelector to an ASP.NET MVC application.

Step

Description

1. Add a reference to the Infragistics namespace.

Add the Infragistics.Web.Mvc namespace to your View code.

In ASPX:

<%=Import Namespace=”Infragistics.Web.Mvc” %>
2. Add a reference to the required JavaScript resources. 1. Add script reference to the igLoader.

Add the following script reference to the head section of the View.

In ASPX:

<script src="[path to js folder]/infragistics.loader.js"></script>

2. Add the igLoader definition.

The following code loads the required resources using the Infragistics Loader.

In ASPX:

<%=Html.Infragistics()
        .Loader()
        .ScriptPath("[path to js folder]")
        .CssPath("[path to css folder]")
        .Render()
%>
3. Add the igPivotDataSelector and configure the data source.

The following code adds an igPivotDataSelector bound to an igOlapXmlaDataSource:

In ASPX:

<%= Html.Infragistics().PivotDataSelector()
.DataSourceOptions(
    dataSourceOptions => dataSourceOptions
        .Columns("[Product].[Product Categories]")
        .Rows("[Sales Territory].[Sales Territory]")
        .Measures("[Measures].[Internet Order Count]")
        .XmlaOptions(
        xmlaOptions => xmlaOptions
            .ServerUrl("http://sampledata.infragistics.com/olap/msmdpump.dll")
            .Catalog("Adventure Works DW Standard Edition")
            .Cube("Adventure Works")
            .MeasureGroup("Internet Sales"))).Render()
%>

If you prefer to use an already preconfigured data source you need to set the DataSourceID property . The code example below assumes that an igOlapXmlaDataSource or igOlapFlatDataSource with ID of “olapDataSource” is present in the view. (For details, refer to Adding igOlapXmlaDataSource to an ASP.NET MVC Application or Adding igOlapFlatDataSource to an ASP.NET MVC Application.)

In ASPX:

<%= Html.Infragistics().PivotDataSelector()
.DataSourceID(“olapDataSource”)
.Render()
%>


Related Content

Topics

The following topics provide additional information related to this topic.

Topic

Purpose

This topic explains, in both conceptual and step-by-step form, how to add the igOlapFlatDataSource™ control to an ASP.NET MVC application using ASP.NET MVC helper.

This topic explains, in both conceptual and step-by-step form, how to add the igOlapXmlaDataSource™ control to an ASP.NET MVC application using ASP.NET MVC helper.

This topic provides conceptual information about the igPivotGrid™ control including its main features, minimum requirements, and user functionality.

This topic provides conceptual information about the igPivotView™ control including its main features, minimum requirements, and user functionality.


Samples

The following samples provide additional information related to this topic.

Sample

Purpose

This sample demonstrates how to use the ASP.NET MVC Helper for the igOlapFlatDataSource and how to use this data source in igPivotDataSelector and igPivotGrid.

This sample demonstrates how to use the ASP.NET MVC Helper for the igOlapXmlaDataSource and how to use this data source in igPivotDataSelector and igPivotGrid.