Paging lost while bind RadGrid clientside

4 posts, 0 answers
  1. Ruchi
    Ruchi avatar
    54 posts
    Member since:
    Apr 2012

    Posted 02 Mar 2015 Link to this post

    Hello Team,

    I have created a radgrid from Cs as per the wbelow code:
    RadGrid radGridNew = new RadGrid();
     radGridNew.ID = "rgAcc" + Guid.NewGuid().ToString().Replace("-", "");
     radGridNew.ClientSettings.ClientEvents.OnGridCreated = "GridCreated";
     radGridNew.ClientSettings.ClientEvents.OnCommand = "RadGrid1_Command";
     radGridNew.AllowPaging = true;
     radGridNew.PageSize = 10;
     GridBoundColumn colLogDate = new GridBoundColumn();
     colLogDate.DataField = "LogDate";
     colLogDate.UniqueName = "LogDate";
     colLogDate.DataType = typeof(DateTime);
     colLogDate.HeaderText = "Log date";
     GridBoundColumn colIPAddress = new GridBoundColumn();
     colIPAddress.DataField = "IPAddress";
     colIPAddress.UniqueName = "IPAddress";
     colIPAddress.DataType = typeof(string);
     colIPAddress.HeaderText = "IP Address ";
     GridBoundColumn colResult = new GridBoundColumn();
     colResult.DataField = "Result";
     colResult.UniqueName = "Result";
     colResult.DataType = typeof(string);
     colResult.HeaderText = "Result";
     radGridNew.Columns.Add(colLogDate);
     radGridNew.Columns.Add(colIPAddress);
     radGridNew.Columns.Add(colResult);
     radGridNew.AllowSorting = true;
     radGridNew.MasterTableView.AllowMultiColumnSorting = true;
     radGridNew.ShowFooter = true;
     radGridNew.AutoGenerateColumns = false;
     radGridNew.MasterTableView.PagerStyle.AlwaysVisible = true;
     radAcc.Controls.Add(radGridNew);

    On Grid Created Event We have called a page that gives data in Json Object as below:
    function GridCreated(sender, eventArgs) {
                   var Id = sender.ClientID;
                   $.ajax({
                       type: "GET",
                       url: "LoadWidgetsAsync.aspx",
                       contentType: "application/json; charset=utf-8",
                       data: { Wid: 1, widgetName: "AccountActivityWidget", ID: Id },
                       async: true,
                       success:
                           function (result) {
                               if (result.length > 0) {
                                   var grid = $find(result[0]);
                                   var tableView = grid.get_masterTableView();                               
                                   tableView.set_dataSource(result[1]);                               
                                   tableView.dataBind();
                               }
                           },
                       error: function () {
                           alert('Error on binding the data');
                       }
                   });
           }

    Once it bind the data to grid, It seems all data in one page rather then displaying only data of first page defined in page size.

    Can anyone help me out with this?

    Thanks and regards,
    Ruchi Patel
  2. Ruchi
    Ruchi avatar
    54 posts
    Member since:
    Apr 2012

    Posted 02 Mar 2015 Link to this post

    Please find attachment to have a look at out put.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ruchi
    Ruchi avatar
    54 posts
    Member since:
    Apr 2012

    Posted 02 Mar 2015 Link to this post

    Sorry, it was giving error while uploading image.
  5. Radoslav
    Admin
    Radoslav avatar
    1564 posts

    Posted 05 Mar 2015 Link to this post

    Hi Ruchi,

    Could you please try setting the virtualItemCount property of the masterTableView like is shown in the following example and let me know if the issue still exits:
    http://demos.telerik.com/aspnet-ajax/grid/examples/data-binding/client-side/programmatic/defaultcs.aspx
    function updateVirtualItemCount(result) {
                    var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
                    tableView.set_virtualItemCount(result);
    }

    Looking forward for your reply.

    Regards,
    Radoslav
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top