[Solved] OnScroll not firing if there are frozen columns

[Sean]

I am creating a grid dynamically and setting client events in code behind. If I freeze any columns the OnScroll client event does not fire for horizontal scroll. It continues to fire for vertical but not horizontal.  Is this a bug? As soon as I comment out line three the event fires.

currentGrid.ClientSettings.ClientEvents.OnScroll =

"Scroll";

 

currentGrid.ClientSettings.Scrolling.UseStaticHeaders =

 

true;

 

currentGrid.ClientSettings.Scrolling.FrozenColumnsCount = 2;

Thanks,
Sean

 

[Pavlina]

Hi Sean,

Could you please confirm that you are using 2010.1 519 version of RadControls for ASP.NET AJAX in your project?

Kind regards,
Pavlina
the Telerik team

[Sean]

I'm using version 2009.3.1103.35

[Sean]

Any comments regarding my version. Is this a bug and if so is there a hotfix?

[Pavlina]

Hi Sean,

When using frozen columns, there is one <div> with a "fake" scrollbar, which does not actually scroll the RadGrid columns, but causes them to hide and show (otherwise it is not possible to keep frozen columns always visible). Therefore it is expected OnScroll client-side event not firing.

Regards,
Pavlina
the Telerik team

[Sean]

You might want to mention that in your documentation before you have people waste hours researching the issue. So you are telling me it is "expected"? That an event is not expected to fire if an option is enabled? This is an absolute bug in my mind. How am I to persist the horizontal scroll when columns are frozen? You offer no solution just that its expected to happen. Is the RadGrid not capable of this? 

[Pavlina]

Hello Sean,

To subscribing to the onscroll event of the fake scrollbar element ($get(sender.get_id() + "_Frozen")), you should also subscribe to the onscroll event of the data area wrapper.

You can subscribe to the onscroll event as demonstrated below.

<telerik:RadGrid
    ID="RadGrid1"
    runat="server"
    Width="600px"
    OnNeedDataSource="RadGrid1_NeedDataSource">
    <ClientSettings>
        <Scrolling AllowScroll="true" UseStaticHeaders="true" FrozenColumnsCount="1" />
        <ClientEvents OnGridCreated="MyGridCreated" />
    </ClientSettings>
</telerik:RadGrid>

<script type="text/javascript">

function MyGridCreated(sender, args)
{
    var frozenWrapper = $get(sender.get_id() + "_Frozen");
    if (frozenWrapper)
        $addHandler(frozenWrapper, "scroll", gridscroll);
}

function gridscroll(e)
{
    document.title = new Date();
}

</script>

I hope this help.

Kind regards,
Pavlina
the Telerik team

[Sean]

How would I get the position x and y or scrollLeft  and scrollTop of that div within the gridScroll(e) event? I need to be able to persist that to a cookie and when the grid is rebinded reposition the grid back to the original scroll coordinates.

Thanks so much for your help, we are really close.

[Pavlina]

Hello Sean,

Please refer to the attached project for more information about how to achieve the desired result. Give it a try and let me know if it helps.

Kind regards,
Pavlina
the Telerik team

[Rob]

Is there any update to this.  I tried this example technique but e.clientX is "undefined"

[Venelin]

Hi Rob,

We addressed your issue in the support ticket that you have opened.
Also if someone else gets undefined for e.clientX you can use the following approach instead:

function onGridCreated(sender, args) {
    var frozenWrapper = $get(sender.get_id() + "_Frozen");
    if (frozenWrapper) {
        $addHandler(frozenWrapper, "scroll", onscroll);
    }
}

function onscroll(e) {
    console.log(e.target.scrollLeft);
}

I hope this helps.

Regards,
Venelin
Telerik

[Rob]

This works, thank you!