jQuery UI Widgets Forums Angular jqxPivotGrid expand rows and columns

This topic contains 9 replies, has 2 voices, and was last updated by  Todor 5 months, 1 week ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • jqxPivotGrid expand rows and columns #104745

    weibao
    Participant

    When I run the following code, the pivot grid is able to populate data from a remote server. But the first row and column never get expanded. Where should I execute the functions to expand rows & columns?

    ngAfterViewInit(): void {
    this.myService.getData()
    .subscribe(data => {
    this.createPivotDataSource(data);
    }, err => {
    console.log(err);
    });

    this.pivotGrid1.getPivotRows().items[0].expand();
    this.pivotGrid1.getPivotColumns().items[0].expand();
    }

    jqxPivotGrid expand rows and columns #104754

    Todor
    Participant

    Hello weibao,

    You execute the functions in the right place – ngAfterViewInit. You didn’t show the whole code, but to be able to use this.pivotGrid1.getPivotRows().items[0].expand(); you have to add the following:

    import { Component, ViewChild, AfterViewInit } from '@angular/core';
    ...
    export class AppComponent {
        @ViewChild('pivotGrid1') pivotGrid1: jqxPivotGridComponent;
        ...
        constructor() { ... }
    
        ngAfterViewInit(): void {
          ....
          this.pivotGrid1.getPivotRows().items[0].expand();
        }

    Let us know if you need further assistance.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com

    • This reply was modified 5 months, 1 week ago by  Todor.
    • This reply was modified 5 months, 1 week ago by  Todor.
    jqxPivotGrid expand rows and columns #104780

    weibao
    Participant

    I got this error message: ERROR TypeError: Cannot read property ‘expand’ of undefined

    Here’s my whole code:

    import { Component, ViewChild, OnInit, AfterViewInit } from ‘@angular/core’;
    import { jqxPivotGridComponent } from ‘jqwidgets-scripts/jqwidgets-ts/angular_jqxpivotgrid’;
    import { jqxButtonComponent } from ‘jqwidgets-scripts/jqwidgets-ts/angular_jqxbuttons’;
    import { ScenarioDetail } from ‘../models/scenarioDetail.model’;
    import { ScenarioDetailService } from “../scenario-detail.service”;

    @Component({
    selector: ‘app-scenario-detail’,
    templateUrl: ‘./scenario-detail.component.html’,
    styleUrls: [‘./scenario-detail.component.css’],
    })
    export class ScenarioDetailComponent implements OnInit, AfterViewInit {
    @ViewChild(‘pivotGrid1’) pivotGrid1: jqxPivotGridComponent;

    scenarioDetails: ScenarioDetail[];
    gridData;
    pivotDataSource;
    source;
    dataAdapter;

    constructor(private scenariodetailService: ScenarioDetailService) {
    this.createPivotDataSource(null);
    }

    ngAfterViewInit(): void {
    this.scenariodetailService.getDefaultScenario()
    .subscribe(data => {
    this.createPivotDataSource(data);
    }, err => {
    console.log(err);
    });

    this.pivotGrid1.getPivotRows().items[0].expand();
    this.pivotGrid1.getPivotColumns().items[0].expand();
    }

    jqxPivotGrid expand rows and columns #104781

    weibao
    Participant

    It seems like that this.pivotGrid1.getPivotRows().items[0].expand() runs before this.createPivotDataSource(data)

    • This reply was modified 5 months, 1 week ago by  weibao.
    jqxPivotGrid expand rows and columns #104787

    Todor
    Participant

    Hello weibao,

    Try to move the two rows inside the subscription:

    ngAfterViewInit(): void {
    this.scenariodetailService.getDefaultScenario()
    .subscribe(data => {
        this.createPivotDataSource(data);
    
        this.pivotGrid1.getPivotRows().items[0].expand();
        this.pivotGrid1.getPivotColumns().items[0].expand();
    }, err => {
    console.log(err);
    });

    Let us know if you need further assistance.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com

    • This reply was modified 5 months, 1 week ago by  Todor.
    jqxPivotGrid expand rows and columns #104825

    weibao
    Participant

    not working. still got the same error: Cannot read property ‘expand’ of undefined.
    when this.pivotGrid1.getPivotRows().items[0].expand() is called, this.PivotGrid1 is not available yet.

    jqxPivotGrid expand rows and columns #104826

    weibao
    Participant

    Please ignore the reply above and see this one.

    not working. still got the same error: Cannot read property ‘expand’ of undefined.
    when this.pivotGrid1.getPivotRows().items[0].expand() is called, this.PivotGrid1.getPivotRows.items doesn’t return any items.

    jqxPivotGrid expand rows and columns #104830

    Todor
    Participant

    Hello weibao,

    You could try to move the two lines of code in setTimeout. If that doesn’t fix the problem, could you please provide an codesandbox example with your code then we would be able to properly investigate it.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com

    jqxPivotGrid expand rows and columns #104841

    weibao
    Participant

    yes, it works if I move the code to setTimeout. But why?
    Also, the pivotGrid has 1422 rows. When this.pivotGrid1.getPivotRows().items[0].expand() is called, the whole expandable column disappears. It comes back until I click any cell in the grid. Is it a bug?

    jqxPivotGrid expand rows and columns #104848

    Todor
    Participant

    Hello weibao,

    It works because the data is loaded asynchronously through your service and there is a little delay.
    Could you please provide an example which shows this behavior?

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.