RadGrid Scroll bar flickering during page refresh(UpdatePannel)

[Bill Delisi]

Hi,

I am working on the hierarchical radgrid and displaying data using code behind data binding, also  I am using  AllowKeyboardNavigation = "true" and AllowActiveRowCycle = "true" and <Selecting AllowRowSelect="true"> for the client settings of my RadGrid. My Grid is in an UpdatePannel.

My requirement is when my grid is refreshed then the selected row should be selected and the scroll bar position should be at the same  location but now when it is refreshing scroll bar is moved to the top of the grid at first and then it coms back to the selected position(flickering). this is happening when  I am clicking on the grid rows and also using the "UP ARROW" key to the radgrid.

could you please help me on the above requirement?

Thanks and Regards,

[Pavlina]

Hello,

Try using RadAjaxManager to ajaxify the grid instead of UpdatePanel and let me know if you still observe the flickering:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
      <AjaxSettings>
          <telerik:AjaxSetting AjaxControlID="RadGrid1">
              <UpdatedControls>
                  <telerik:AjaxUpdatedControl ControlID="RadGrid1"/>
              </UpdatedControls>
          </telerik:AjaxSetting>
      </AjaxSettings>
  </telerik:RadAjaxManager>

Regards,
Pavlina
Telerik

[San]

Hi Pavlina, 

Is there any other way to resolve this flickering after the above suggestion ? As still this seems to be there 

[Eyup]

Hello San,

 

You have 2 options to achieve this requirement:

1. Use the following approach:

<script type="text/javascript">
 
    var prm = Sys.WebForms.PageRequestManager.getInstance();
 
    prm.add_beginRequest(function() {
        prm._scrollPosition = null;
    });
 
</script>

As suggested here:
https://www.telerik.com/forums/how-do-you-prevent-browser-scrolling-after-ajax-postback#Bki1UISTeU6Z0MCtGgUZjA

You can also find other methods in this post:
https://www.telerik.com/forums/radgrid-jumps-to-first-line-when-selecting-row#oMKrk-s78UiZ5ik2B22pow

2. Replace the UpdatePanel with RadAjaxPanel and use RadAjaxLoadingPanel with Skin:
https://demos.telerik.com/aspnet-ajax/ajaxpanel/overview/defaultcs.aspx

I hope this will prove helpful.

 

Regards,
Eyup
Progress Telerik