A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://js.devexpress.com/Documentation/ApiReference/Data_Layer/PivotGridDataSource/Methods/ below:

DevExtreme Vue - PivotGridDataSource Methods

This section describes methods that control the PivotGridDataSource.

Collapses all header items of a field with the specified identifier.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

pivotGridDataSource.collapseAll("Region");
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        this.pivotGridDataSource.collapseAll("Region");
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        pivotGridDataSource.collapseAll('Region');
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        pivotGridDataSource.collapseAll('Region');
    }
    // ...
}
export default App;
See Also

Collapses a specific header item.

Parameters:

The area that contains the header item to collapse.

A path to the header item.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

// Collapses the second quarter of 2015 in the column area
pivotGridDataSource.collapseHeaderItem("column", [2015, 2]);
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        // Collapses the second quarter of 2015 in the column area
        this.pivotGridDataSource.collapseHeaderItem("column", [2015, 2]);
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        // Collapses the second quarter of 2015 in the column area
        pivotGridDataSource.collapseHeaderItem('column', [2015, 2]);
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        // Collapses the second quarter of 2015 in the column area
        pivotGridDataSource.collapseHeaderItem('column', [2015, 2]);
    }
    // ...
}
export default App;
See Also

Provides access to the facts that were used to calculate a specific summary value.

Parameters:

Configuration object.

Object structure:

Name Type Description columnPath

Array<String | Number | Date>

A path to the cell with the summary value by columns.

customColumns

Array<String>

The field names to be included for each fact.

dataIndex

Number

The index of the measure for which the summary value is calculated.

maxRowCount

Number

Maximum number of facts to get.

rowPath

Array<String | Number | Date>

A path to the cell with the summary value by rows.

A drill-down data source.

Data in the drill-down data source is paginated by default. Only the items on the first page are loaded when you call the load() method. To get all the items, turn the pagination off:

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

var drillDownDataSource = pivotGridDataSource.createDrillDownDataSource({
    // Options are passed here
});

drillDownDataSource.paginate(false);

drillDownDataSource.load()
    .done(function (data) {
        // Process "data" here
    })
    .fail(function (error) {
        // Handle the "error" here
    });
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
import DataSource from "devextreme/data/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    drillDownDataSource: DataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        this.drillDownDataSource = this.pivotGridDataSource.createDrillDownDataSource({
            // Options are passed here
        });

        this.drillDownDataSource.paginate(false);

        this.drillDownDataSource.load()
            .then(
                (data) => { /* Process "data" here */ },
                (error) => { /* Handle the "error" here */ }
            )
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        this.drillDownDataSource = pivotGridDataSource.createDrillDownDataSource({
            // Options are passed here
        });

        this.drillDownDataSource.paginate(false);

        this.drillDownDataSource.load()
            .then(
                (data) => { /* Process "data" here */ },
                (error) => { /* Handle the "error" here */ }
            )
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        this.drillDownDataSource = pivotGridDataSource.createDrillDownDataSource({
            // Options are passed here
        });

        this.drillDownDataSource.paginate(false);

        this.drillDownDataSource.load()
            .then(
                (data) => { /* Process "data" here */ },
                (error) => { /* Handle the "error" here */ }
            )
    }
    // ...
}
export default App;

View Demo View on GitHub

See Also

Disposes of all the resources allocated to the PivotGridDataSource instance.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

pivotGridDataSource.dispose();
Angular
import { ..., OnDestroy } from '@angular/core';
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent implements OnDestroy {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });
    }

    ngOnDestroy() {
        this.pivotGridDataSource.dispose();
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    beforeDestroy() {
        pivotGridDataSource.dispose();
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    componentWillUnmount() {
        pivotGridDataSource.dispose();
    }
    // ...
}
export default App;

Do not call this method if the UI component created the PivotGridDataSource instance.

Expands all the header items of a field with the specified identifier.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

pivotGridDataSource.expandAll("Region");
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        this.pivotGridDataSource.expandAll("Region");
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        pivotGridDataSource.expandAll('Region');
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        pivotGridDataSource.expandAll('Region');
    }
    // ...
}
export default App;
See Also

Expands a specific header item.

Parameters:

The area that contains the header item to expand.

A path to the header item.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

// Expands the second quarter of 2015 in the column area
pivotGridDataSource.expandHeaderItem("column", [2015, 2]);
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        // Expands the second quarter of 2015 in the column area
        this.pivotGridDataSource.expandHeaderItem("column", [2015, 2]);
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        // Expands the second quarter of 2015 in the column area
        pivotGridDataSource.expandHeaderItem('column', [2015, 2]);
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        // Expands the second quarter of 2015 in the column area
        pivotGridDataSource.expandHeaderItem('column', [2015, 2]);
    }
    // ...
}
export default App;
See Also

Gets all the properties of a field with the specified identifier.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // ...
    fields: [{
        caption: "Sales",
        dataField: "amount",
        summaryType: "sum",
        area: "data"
    }]
});

// The following commands return the same object
pivotGridDataSource.field("Sales");
pivotGridDataSource.field("amount");
pivotGridDataSource.field(0);
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // ...
            fields: [{
                caption: "Sales",
                dataField: "amount",
                summaryType: "sum",
                area: "data"
            }]
        });

        // The following commands return the same object
        this.pivotGridDataSource.field("Sales");
        this.pivotGridDataSource.field("amount");
        this.pivotGridDataSource.field(0);
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // ...
    fields: [{
        caption: 'Sales',
        dataField: 'amount',
        summaryType: 'sum',
        area: 'data'
    }]
});

export default {
    mounted() {
        // The following commands return the same object
        pivotGridDataSource.field('Sales');
        pivotGridDataSource.field('amount');
        pivotGridDataSource.field(0);
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // ...
    fields: [{
        caption: 'Sales',
        dataField: 'amount',
        summaryType: 'sum',
        area: 'data'
    }]
});

class App extends React.Component {
    constructor(props) {
        super(props);

        // The following commands return the same object
        pivotGridDataSource.field('Sales');
        pivotGridDataSource.field('amount');
        pivotGridDataSource.field(0);
    }
    // ...
}
export default App;
See Also

Updates field options' values.

Call the load() method to update the PivotGrid:

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // ...
    fields: [{
        caption: "Sales",
        dataField: "amount",
        summaryType: "sum",
        area: "data"
    }]
});

// Changes the "Sales" field's summaryType
pivotGridDataSource.field("Sales", { summaryType: "avg" });
pivotGridDataSource.load();
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // ...
            fields: [{
                caption: "Sales",
                dataField: "amount",
                summaryType: "sum",
                area: "data"
            }]
        });

        // Changes the "Sales" field's summaryType
        this.pivotGridDataSource.field("Sales", { summaryType: "avg" });
        this.pivotGridDataSource.load();
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        // Changes the "Sales" field's summaryType
        pivotGridDataSource.field('Sales', { summaryType: 'avg' });
        pivotGridDataSource.load();
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        // Changes the "Sales" field's summaryType
        pivotGridDataSource.field('Sales', { summaryType: 'avg' });
        pivotGridDataSource.load();
    }
    // ...
}
export default App;

Gets all the fields including those generated automatically.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

var pivotGridFields = pivotGridDataSource.fields();
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        let pivotGridFields = this.pivotGridDataSource.fields();
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        this.pivotGridFields = pivotGridDataSource.fields();
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        this.pivotGridFields = pivotGridDataSource.fields();
    }
    // ...
}
export default App;
See Also

Specifies a new fields collection.

Call the load() method to update the PivotGrid:

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

pivotGridDataSource.fields([{
    dataField: "region",
    area: "row"
}, {
    dataField: "date",
    dataType: "date",
    area: "column"
},  {
    dataField: "sales",
    summaryType: "sum",
    area: "data"
}]);

pivotGridDataSource.load();
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        this.pivotGridDataSource.fields([{
            dataField: "region",
            area: "row"
        }, {
            dataField: "date",
            dataType: "date",
            area: "column"
        },  {
            dataField: "sales",
            summaryType: "sum",
            area: "data"
        }]);

        this.pivotGridDataSource.load();
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        pivotGridDataSource.fields([{
            dataField: 'region',
            area: 'row'
        }, {
            dataField: 'date',
            dataType: 'date',
            area: 'column'
        },  {
            dataField: 'sales',
            summaryType: 'sum',
            area: 'data'
        }]);

        pivotGridDataSource.load();
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        pivotGridDataSource.fields([{
            dataField: 'region',
            area: 'row'
        }, {
            dataField: 'date',
            dataType: 'date',
            area: 'column'
        },  {
            dataField: 'sales',
            summaryType: 'sum',
            area: 'data'
        }]);

        pivotGridDataSource.load();
    }
    // ...
}
export default App;

Gets the filter property's value. Does not affect an XmlaStore.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // ...
    filter: ["age", ">", 18]
});

var filterExpr = pivotGridDataSource.filter(); // returns ["age", ">", 18]
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // ...
            filter: ["age", ">", 18]
        });

        let filterExpr = this.pivotGridDataSource.filter(); // returns ["age", ">", 18]
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // ...
    filter: ['age', '>', 18]
});

export default {
    mounted() {
        this.filterExpr = pivotGridDataSource.filter(); // returns ["age", ">", 18]
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // ...
    filter: ['age', '>', 18]
});

class App extends React.Component {
    constructor(props) {
        super(props);

        this.filterExpr = pivotGridDataSource.filter(); // returns ["age", ">", 18]
    }
    // ...
}
export default App;
See Also

Sets the filter property's value. Does not affect an XmlaStore.

Parameters:

A filter expression. Pass null to clear filtering settings.

Call the reload() method to update the PivotGrid:

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

pivotGridDataSource.filter(["age", ">", 18]);
// or
// pivotGridDataSource.filter("age", ">", 18);

pivotGridDataSource.reload();
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        this.pivotGridDataSource.filter(["age", ">", 18]);
        // or
        // this.pivotGridDataSource.filter("age", ">", 18);

        this.pivotGridDataSource.reload();
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        pivotGridDataSource.filter(['age', '>', 18]);
        // or
        // pivotGridDataSource.filter('age', '>', 18);

        pivotGridDataSource.reload();
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        pivotGridDataSource.filter(['age', '>', 18]);
        // or
        // pivotGridDataSource.filter('age', '>', 18);

        pivotGridDataSource.reload();
    }
    // ...
}
export default App;
See Also

Gets all the fields within an area.

Parameters:

The area that contains the fields to get.

Pass true to return grouped fields in a single array entry or false to return them as separate entries.
The default value is false.

All the options of all the fields within the area.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

var columnAreaFields = pivotGridDataSource.getAreaFields("column", true);
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        let columnAreaFields = this.pivotGridDataSource.getAreaFields("column", true);
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        this.columnAreaFields = pivotGridDataSource.getAreaFields('column', true);
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        this.columnAreaFields = pivotGridDataSource.getAreaFields('column', true);
    }
    // ...
}
export default App;
See Also

Gets the loaded data. Another data portion is loaded every time a header item is expanded.

This method returns an object with the following structure:

{
    rows: [{
        index: /* Row 1 index */,
        text:  /* Row 1 caption */,
        value: /* Row 1 value */
    }, {
        index: /* Row 2 index */,
        text:  /* Row 2 caption */,
        value: /* Row 2 value */,
        children: [{
            index: /* Row 2.1 index */,
            text:  /* Row 2.1 caption */,
            value: /* Row 2.1 value */,
            children: [ /* Level 3 and deeper */ ]
        },
        // ...
        ]
    },
    // ...
    ],
    columns: [{
        index: /* Column 1 index */,
        text:  /* Column 1 caption */,
        value: /* Column 1 value */
    }, {
        index: /* Column 2 index */,
        text:  /* Column 2 caption */,
        value: /* Column 2 value */,
        children: [{
            index: /* Column 2.1 index */,
            text:  /* Column 2.1 caption */,
            value: /* Column 2.1 value */,
            children: [ /* Level 3 and deeper */ ]
        },
        // ...
        ]
    },
    // ...
    ],
    values: [
        [
            [
                /* Measure 1 summary value 1 */,
                /* Measure 2 summary value 1 */,
                // ...
            ],
            [
                /* Measure 1 summary value 2 */,
                /* Measure 2 summary value 2 */,
                // ...
            ],
            // ...
        ],
        // ...
    ],
    grandTotalRowIndex: 0,
    grandTotalColumnIndex: 0

}

"Measure" refers to a pivot grid field in the data

area

.

The object mentioned above contains three arrays: rows, columns, and values. Objects in the rows and columns arrays describe header items in the row and column areas and contain the following fields:

The values array contains summary values. Each of them has three indexes. To get a summary value, use the following pattern:

var value = values[/* row index */][/* column index */][/* measure index */];

You can pass grandTotalRowIndex and grandTotalColumnIndex as row index and column index to get grand total values.

If you use the XmlaStore and your data area is empty, this method returns the default measure values. They are hidden from the UI until you place the default measure in the data area using the field(id, options) method. The default measure is specified on the OLAP server.

pivotGridDataSource.field(/* measure name */, { area: "data" });
See Also

Checks whether the PivotGridDataSource is loading data.

true if data is being loaded; otherwise false.

Starts loading data.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

pivotGridDataSource.load()
    .done(function (data) {
        // Process "data" here
    })
    .fail(function (error) {
        // Handle the "error" here
    });
Angular
import PivotGridDataSource from "devextreme/ui/pivot_grid/data_source";
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });
        this.pivotGridDataSource.load()
            .then(
                (data) => { /* Process "data" here */ },
                (error) => { /* Handle the "error" here */ }
            );
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        pivotGridDataSource.load()
            .then(
                (data) => { /* Process "data" here */ },
                (error) => { /* Handle the "error" here */ }
            );
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        pivotGridDataSource.load()
            .then(
                (data) => { /* Process "data" here */ },
                (error) => { /* Handle the "error" here */ }
            );
    }
    // ...
}
export default App;
See Also

Detaches all event handlers from a single event.

The object for which this method is called.

Detaches a particular event handler from a single event.

Parameters:

The event's name.

The event's handler.

The object for which this method is called.

Subscribes to an event.

Parameters:

The event's name.

The event's handler.

The object for which this method is called.

Use this method to subscribe to one of the events listed in the Events section.

See Also

Subscribes to events.

Parameters:

Events with their handlers: { "eventName1": handler1, "eventName2": handler2, ...}

The object for which this method is called.

Use this method to subscribe to several events with one method call. Available events are listed in the Events section.

See Also

Clears the loaded PivotGridDataSource data and calls the load() method.

Gets the current PivotGridDataSource state. Part of the PivotGrid UI component's state storing feature.

The PivotGridDataSource state - fields configuration, filters, expanded headers, etc.

jQuery
var pivotGridDataSource = new DevExpress.data.PivotGridDataSource({
    // PivotGridDataSource is configured here
});

// Get the state
var pivotGridState = pivotGridDataSource.state();

// Set the state
pivotGridDataSource.state(pivotGridState);

// Reset to the default state
pivotGridDataSource.state({});
// ===== or =====
pivotGridDataSource.state(null);
Angular
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';
// ...
export class AppComponent {
    pivotGridDataSource: PivotGridDataSource;
    constructor() {
        this.pivotGridDataSource = new PivotGridDataSource({
            // PivotGridDataSource is configured here
        });

        // Get the state
        let pivotGridState = this.pivotGridDataSource.state();

        // Set the state
        this.pivotGridDataSource.state(pivotGridState);

        // Reset to the default state
        this.pivotGridDataSource.state({});
        // ===== or =====
        this.pivotGridDataSource.state(null);
    }
}
Vue
  
<script>
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

export default {
    mounted() {
        // Get the state
        let pivotGridState = pivotGridDataSource.state();

        // Set the state
        pivotGridDataSource.state(pivotGridState);

        // Reset to the default state
        pivotGridDataSource.state({});
        // ===== or =====
        pivotGridDataSource.state(null);
    },
    // ...
}
</script>
React
// ...
import PivotGridDataSource from 'devextreme/ui/pivot_grid/data_source';

const pivotGridDataSource = new PivotGridDataSource({
    // PivotGridDataSource is configured here
});

class App extends React.Component {
    constructor(props) {
        super(props);

        // Get the state
        let pivotGridState = pivotGridDataSource.state();

        // Set the state
        pivotGridDataSource.state(pivotGridState);

        // Reset to the default state
        pivotGridDataSource.state({});
        // ===== or =====
        pivotGridDataSource.state(null);
    }
    // ...
}
export default App;

View Demo

Sets the PivotGridDataSource state. Part of the PivotGrid UI component's state storing feature.

Parameters:

The state returned by the state() method. Pass null to reset the state to default.

Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4