How to set RadGrid Current PageIndex and Current Row after ajaxRequest("Rebind")

6 posts, 0 answers
  1. subhankar
    subhankar avatar
    2 posts
    Member since:
    Nov 2014

    Posted 06 Nov 2014 Link to this post

    Hi Experts

    I'm new in Radgrid and having RadGrid Virtualization,  and used manual binding(NeedDataSource) and set virtual count there. The problem I'm facing when I editing the items  in separate command button to show the all relevant items in RadWindow and update there, after ajaxRequest("Rebind"), Radgrid lost PageIndex and Current Row Number

    Please suggest how to set the PageIndex and Current row after rebind. below is the details in data binding 

    protected void RadGrd1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
          {          
              RadGrd1.DataSource = GridRecordSource;
              RadGrd1.MasterTableView.VirtualItemCount = ((DataTable)Application["_GridRowSource"]).Rows.Count;    
               
          }       
          private DataTable GridRecordSource
          {
              get {
                      object RowSource= Application["_GridRowSource"];
                      if (RowSource!=null)
                        {
                           return RowSource as DataTable;
                        }
                      else
                      {
                          GridRowSource=UserBL.SelectAll("CustomerDetail");
                          Application["_GridRowSource"]=GridRowSource;
                          // RadGrd1.CurrentPageIndex * RadGrd1.PageSize + " AND " + ((RadGrd1.CurrentPageIndex + 1) * RadGrd1.PageSize));
                          return GridRowSource;
                      }
                   }
     
              
          }

      And following is the aspx markup
    <telerik:RadGrid runat="server" ID="RadGrd1" AutoGenerateColumns="False"
                           GridLines ="Horizontal" ShowStatusBar="true"
                          OnNeedDataSource="RadGrd1_NeedDataSource"                                 
                          OnDataBound="RadGrid1_DataBound"
                          Skin="Outlook" Width="143px" >
                      <MasterTableView Width="99%" AllowPaging="true" PageSize="50" 
                          AllowSorting="false" BorderStyle="None" ClientDataKeyNames="RecordID"
                          TableLayout="Fixed" NoMasterRecordsText="Records not found in Customerdetail tables" >
                          <Columns>
                              <telerik:GridBoundColumn DataField="FirstName" HeaderText="Customer Name" UniqueName="FirstName" HeaderStyle-Height="122px"  >
                              </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn DataField="LastName" HeaderText="" UniqueName="LastName" Display="false"  >
                              </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn DataField="Phonenumber" HeaderText="" UniqueName="Phonenumber" Display="false"  >
                              </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn DataField="Email" HeaderText="" UniqueName="Email" Display="false"  >
                              </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn DataField="dob" HeaderText="" UniqueName="dob" DataType="System.DateTime" Display="false"  >
                              </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn DataField="Country" HeaderText="" UniqueName="Country" Display="false"  >
                              </telerik:GridBoundColumn>
                              <telerik:GridBoundColumn DataField="State" HeaderText="" UniqueName="State" Display="false"  >
                              </telerik:GridBoundColumn>
                          </Columns>
                          <CommandItemTemplate >
                          </CommandItemTemplate>
                     </MasterTableView>
                   <PagerStyle  Visible="false" />
                  <ClientSettings ReorderColumnsOnClient="true" AllowColumnsReorder="true" ColumnsReorderMethod="Reorder"
                      <ClientEvents OnRowSelecting="PushToDock"/>                
                      <Virtualization InitiallyCachedItemsCount="50" RetrievedItemsPerRequest="50" ItemsPerView="50"
                          EnableVirtualization="true"
                          LoadingPanelID="RadAjaxLoadingPanel1"  />
                       <Selecting AllowRowSelect="true"   />
                      <Scrolling ScrollHeight="200px" AllowScroll="True" EnableVirtualScrollPaging="true"
                        UseStaticHeaders="true"  />
                      <Resizing AllowColumnResize="true" />                      
                  </ClientSettings
                  <SelectedItemStyle Font-Bold="true" ForeColor="#000099" />             
              </telerik:RadGrid>
    following is the Javascript for edit the items
    function ShowEditForm(tcRecordID, rowIndex) {
             tcRecordID = $('input[id$=Recno]').val();       
             $('input[id$=Recno]').val(tcRecordID); // store the RecordID into asp hidden field so that recordposition will be thre
             var openwindow = window.radopen("EditAddRecord.aspx?RecordID=" + tcRecordID, "UserListDialog");
             return false;
         }
  2. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 11 Nov 2014 Link to this post

    Hi Subhankar,

    In this case possible approach would be to keep the PageIndex and the RowCount into the Session. Then you can simple handle the AjaxRequest server event and restore the values.

    For example:
    this.RadGrid1.CurrentPageIndex = Convert.ToInt32(Session["RadGridCurrentPageIndex"]);
    this.RadGrid1.MasterTableView.Rebind();


    Regards,
    Maria Ilieva
    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.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. subhankar
    subhankar avatar
    2 posts
    Member since:
    Nov 2014

    Posted 11 Nov 2014 in reply to Maria Ilieva Link to this post

    Hi Maria,
    Thanks for replying. I'm not sure what am I missing here, because all the time currentpage index in server side is zero, however during Javascript I get hold the current position in global variable and store the current page index correctly, but whenever I'm paging to last page of the RadGrid , scrolling button does not move to last page after AzaxRequest("Rebind"), because by default after azaxifying page move to default zero.
    here is the code for Javascript once click on any item in RadGrid
    aspx markup
    <ClientEvents OnRowSelecting="PushToDock" />
    JavaScript :
    var currentRowIndex = 0;
       var curntPageIndex = 0;
       var scrollpos = 0;
       var selected = {}; // create an empty array whether row is selected or not for globally

    function PushToDock(sender, EventArgs) {
        var grid = sender;
        var MasterTable = grid.get_masterTableView();
        var row = MasterTable.get_dataItems()[EventArgs.get_itemIndexHierarchical()];
        $('#<%=lblCustName.ClientID%>').html(MasterTable.getCellByColumnUniqueName(row, "FirstName").innerHTML.trim() + " " + MasterTable.getCellByColumnUniqueName(row, "LastName").innerHTML.trim());
        $('#<%=lblPhnumber.ClientID%>').html(MasterTable.getCellByColumnUniqueName(row, "Phonenumber").innerHTML.trim());
        $('#<%=lblDOB.ClientID%>').html(MasterTable.getCellByColumnUniqueName(row, "dob").innerHTML.trim());
        $('#<%=lblEmail.ClientID%>').html(MasterTable.getCellByColumnUniqueName(row, "Email").innerHTML.trim());
        $('#<%=lblCountry.ClientID%>').html(MasterTable.getCellByColumnUniqueName(row, "Country").innerHTML.trim());
        $('#<%=lblState.ClientID%>').html(MasterTable.getCellByColumnUniqueName(row, "State").innerHTML.trim());
        var lcRecordID = EventArgs.getDataKeyValue("RecordID");
        $('input[id$=Recno]').val(lcRecordID);
        currentRowIndex = EventArgs.get_itemIndexHierarchical();
        curntPageIndex = MasterTable.get_currentPageIndex();
        $('input[id$=nRowIndex]').val(currentRowIndex);
        if (!selected[lcRecordID]) {
            selected[lcRecordID] = true;
        }
        var y = $get('<%= RadGrd1.ClientID%>_GridData').scrollTop;
        scrollpos = y;
    and after azax request I try to accomplish by this way , but not success
    function pageLoad() {
             var isPostBack = "<%= IsPostBack %>".toLowerCase() == "true" ? true : false;
             if (!isPostBack) {
                 settherow();
             }
    }
    function findScroll(masterTable) {
            if (selected.hasOwnProperty(1)!=true) {
                return;
            }
            $get('<%= RadGrd1.ClientID%>_GridData').scrollTop = scrollpos;
            var FirstName = "";
            var nRecID = "";
            var found = false;        
            var _SelectedRecordID = $('input[id$=Recno]').val();
            while (found==false) {
                var totalRows = $("#RadGrd1_ctl00").find("tbody tr").length;
                for (i = 1; i <= totalRows; i++) {
                    var tr = $("#RadGrd1_ctl00").find("tbody tr:eq(" + i + ")");
                    FirstName = $(tr).find("td:eq(1)").html() == undefined ? "" : $(tr).find("td:eq(1)").html();
                    nRecID = $(tr).find("td:eq(7)").html();
                    if (nRecID == _SelectedRecordID) {
                        found = true;
                        break;
                    }
                }
                scrollpos = scrollpos + 50
                var grd1 = $find("<%= RadGrd1.ClientID%>");
                $get('<%= RadGrd1.ClientID%>_GridData').scrollTop = scrollpos;
                $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("LoadMoreRecords");
                grd1.updateClientState();
                 
                curntPageIndex = curntPageIndex+1
            }
        }
    function settherow() {
            var masterTable = $find("<%= RadGrd1.ClientID %>").get_masterTableView();
            masterTable.clearSelectedItems(); //clear the previously selected items if necessary        
            findScroll(masterTable);
            masterTable.set_currentPageIndex(curntPageIndex, true);
            masterTable.selectItem(masterTable.get_dataItems()[currentRowIndex].get_element());
    }
  5. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 14 Nov 2014 Link to this post

    Hello ,

    Can you please share your full page markup including the Ajax settings, as I suppose that the issue might be related to the Ajax configuration. Thus we can revise the page markup locally and advise you further.

    Regards,
    Maria Ilieva
    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.

     
  6. Umesh
    Umesh avatar
    2 posts
    Member since:
    May 2016

    Posted 03 May Link to this post

    I am using GridSettingsPersister. Why GridPageIndex is not part of the grid settings like sorting, filter etc.?
  7. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 05 May Link to this post

    Hello Umesh,

    The page index is properly saved , you can see the demo below:
    http://demos.telerik.com/aspnet-ajax/controls/examples/integration/persisting-grid-settings/defaultcs.aspx?product=grid

    Regards,
    Maria Ilieva
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017