Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Gaurav Kumar
20
Ig Grid Reloading with dataSource and new Paging.
posted

I Need to refresh My IgGrid with updated datasource . So when I use this method
  $("#Selector").igGrid('option', 'dataSource', dsource);
 It work fine, But if I change the page Size to some other vale then default(its default value is 5) . and then if I call the above method the grid get reload but with the default Pagesize .

My Grid Defination.

    var self.gridPageSize = 5;


      $("#Grid").igGrid({
                autoGenerateColumns: true,
                features: [{
                    name: 'Selection',
                    mode: 'row',
                    multipleSelection: true
                },{
                   name: 'Sorting',
                   firstSortDirection: "descending",
                   type: "local"
               },{
                    name: 'Paging',
                   type: 'local',
                   pageSize: self.gridPageSize,
                   pageIndexChanged: function (ui, args) {  
                        //console.log('pageIndexChanged event fired. Page Index = ' + args.pageIndex);
                        refreshLineItemGrid();                       
                    addChangeEvents();
                   },
                   pageSizeChanged: function (ui, args) {  
                        //console.log('pageSizeChanged event fired. Page Size = ' + args.pageSize);
                        self.gridPageSize = args.pageSize;
                        addChangeEvents();
                   }
               

// refreshLineItemGrid() Method

    refreshLineItemGrid = function() {
            $("#Grid").igGrid('option', 'dataSource', orderLineItems);
            $('#Grid').igGridPaging('pageSize', self.gridPageSize);
            addChangeEvents();
        }

  • 19693
    posted

    Hello Kumar.

    Thank you for using our igGrid.

    By default after setting the dataSource the grid will take the value from the definition of the grid.

    The approach that you used should be working.

    The thing that I didn't get is why you are setting the dataSource again in pageIndexChanged event?

    I tried the solution with the refreshLineItemGrid in pageSizeChanged event handler and it worked for me.

    I used the online  sample  http://igniteui.com/grid/paging

    And the following code snippet:

    var gridPageSize = 5;

    ….

    features: [

                        {

                            name: 'Paging',

                            type: "local",

                            pageSize: 5,

                            pageIndexChanged: function ( ui, args )

                            {                           

                                refreshLineItemGrid();

                            },

                            pageSizeChanged: function ( ui, args )

                            {

                                gridPageSize = args.pageSize;

                            }

                        }

                    ]

    …

    function refreshLineItemGrid()

            {

                $( "#grid" ).igGrid( 'option', 'dataSource', adventureWorks );

               // $( '#grid' ).igGridPaging( 'pageSize', gridPageSize );

            }

    Which version of our components do you use?

    An isolated sample reproducing the behavior will be appreciated.

    Hope hearing from you.