jQuery UI Widgets Forums Getting Started server side rendering in jqx grid in angular

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

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author

  • onkar_anar
    Participant

    We are using angular and jqxgrid. We need to implement server side rendering.

    I am trying to use rendergridrows function to return data which service fetches from api.
    when the rendergridrows function is execute, it does not wait for subscribe to get updated data from service
    and shows existing data in gridDataDetails.
    Can anyone please update me with this?

    Following is snippet for my code till now.

    GridServiceComponent.ts

    
    rendergridrows = (params: any): any => {
        var pageNumber= params.startindex / totalRecords;
        if (pageNumber == NaN) {
          pageNumber = 0;
        }
    
        this._dataService.getDetails('dataId', 'userId', pageNumber, totaRecords)
            .subscribe(res => {
              debugger
              this.gridDataDetails= res.Data;
              this.isUpdateBoundData = true;
            });
        return this.gridDataDetails;
      }
    

    GridServiceComponent.html

    
    <div style="margin-top:2%;margin-left:3%">
        <jqxGrid [width]=" getWidth()" [source]="dataAdapter" [columns]="gridColumns" [columnsresize]="true"
            [enabletooltips]="true" [altrows]="true" [autoheight]="true" [sortable]="true" [pageable]="true"
            [virtualmode]="true" [rendergridrows]="rendergridrows" >
        </jqxGrid>
    </div>
    

    Todor
    Participant

    Hello onkar_anar,

    Please review the following example whether it fits your needs.

    Let us know if you need further assistance.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com


    onkar_anar
    Participant

    Hi,

    I tried the approach as per the link you share but i am facing the same issue, what i am trying to do
    is, i have written one service and trying to fetch data from api as per paging using rendergridrows function.
    Am getting data using service but rendergridrows function is running into loop continuously. what i am expecting is
    rendergridrows function should execute as per paging.
    is there any way to do server side paging using angular and asp .Net MVC.
    Here is the code snippet

    rendergridrows = (params: any): any => {
        var pageNumber= params.startindex / totalRecords;
        if (pageNumber == NaN) {
          pageNumber = 0;
        }
        this._dataService.getDetails('dataId', 'userId', pageNumber, totaRecords)
            .subscribe(res => {
              this.gridDataDetails= res.Data;
              this.myGrid.updatebounddata();
            });
        return this.gridDataDetails;
      }

    Todor
    Participant

    Hello onkar_anar,

    I would suggest you to review the following demo.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com

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

You must be logged in to reply to this topic.