RadLoadingPanel drifting around in Firefox

[improwise]

We have a problem that the RadAjaxLoadingPanel seem to "drift" when you have worked with a page for a while. For example, we load a page containing one RadGrid, click edit and the loading panel will cover the RadGrid completely as it should. However, if you press cancel and the edit again, you will notice that the loading panel is now not 100% where it should be, covering perhaps 95% of the RadGrid but not all of it. This behaviour is only visible in FireFox (latest version) but not IE, Opera etc. and we are using 2010.3.1317.40 of Telerik.

We have tried changing a lot of settings everywhere but we don't seem to be able to find a solution for it, it seems like as soon as we do anything that changes the height (we don't change widht) of the RadGrid, like pressing edit with EditForms enabled, it starts drifting.

We really have no more clues what do to or try here, any ideas?

[improwise]

I think we have realized what is the problem here, even though we havn't been able to solve it. It seems like it has to do with scrolling in Firefox (the firefox windows, not any Telerik scrollbars or similar). If you never scroll the page, it seems like the loading panel is correctly places, but as soon as you scroll the page, the RadLoadingPanel will be displayed in the wrong place (it seems like the offset i similar to the area scrolled, but this hasn't been verified properly). Is this a bug in Telerik and/or Firefox or is it anything we can do about it? We don't have IsSticky enabled.

[Maria Ilieva]

Hi Patrik,

We are not aware of such an issue and could not replicate it locally; I would suggest you revise the following online example which presents the correct behavior in such scenarios.


Best wishes,
Maria Ilieva
the Telerik team

[improwise]

We have tried this on a different computer (even running from another IIS server) and have no problem reproducing the problem every time. What you have to do is to make the Firefox window small enough to force it to show vertical scrollbars. With the vertical scroll untouched (ie showing the top of the page), click on a row (enable client-side row selection needs to be true) and RadLoadingPanel will be displayed correctly. Now, scroll the page vertically, and click again on the row, and the RadLoadingPanel will be displayed in the wrong place. (the offset seem to be releated to the area scrolled). Since the CSS etc. should be the same for both trials here, it seems like the only difference is the page having been scrolled, and that this causes the RadLoadingPanel to be displayed in the wrong place.

Please note that it does not seem to matter what causes the RadLoadingPanel to show, row clicking is just an example. Also please note that the same problem exist for horizontal scrolling, where it is perhaps easier to see the problem. If you scroll both verically and horzontally, it is very obvious that the RadLoadingPanel renders based on how the page looked before scrolling (ie what part of the page you could see).

As this website is built upon DotNetNuke, we can't provide you with a running example in a simple way, but it seems like this could be a bug related to scrolling in Firefox...

[improwise]

We have also tried replacing the RadAjaxManager with a RadAjaxPanel, but the exact same problems exist anyway. We have also done testing with creating very simple pages with no complex logic, filtering etc. and can reproduce the problem in the same way.

Edit: Please note that we are in parallell researching if this could be an issue with CSS/DotNetNuke..

[improwise]

We have tried to find a reason for this in DotNetNuke/CSS but has not been able to do so. Also, everything seems to be working fine in IE, Opera etc. so this seems like either a bug in Telerik (or MS Ajax) or FireFox, or the combination of the two. This assumption is based on the fact that it seem to work in most other browsers, so it is unlikely that this should be due to a design error in the web application itself, or do you disagree?

Something that would be really helpful would be if you could write (or point me to if it already exists) a "How to integrate Telerik into DotNetNuke". We've looked at http://www.telerik.com/help/aspnet-ajax/what-is-dnn.html but it doesnt seem to do more than scratch the surface on that subject when you are a full Telerik customer (ie not just using the Telerik components distributed with DotNetNuke). Some of the unanswered questions I feel are:

1. Should you replace the default ScriptManager with RadScriptManager? Pros/cons?
2. Should you use the Form.Controls.Add(New Telerik.Web.UI.RadStyleSheetManager())  to register the RadStyleSheetManager or is it enough to just drag and drop a RadStyleSheetManager on the user control?
3. How should you setup your DotNetNuke modules, with regards to Telerik? Should the DotNetNuke.Framework.AJAX.RegisterScriptManager() be used?
4. Should you use the "supports partial rendering" on the module definition of the module (which wraps the entire module in an updatepanel) or should that he avoided when using Telerik equivalents (I assume so but still)
   

[improwise]

Update, it seems like this problem was caused by a very badly behaving DotNetNuke skin. Naturally, this was something we tried changing early on in our error searching by using the "skin preview" function in DotNetNuke, but for some strange reason, that did not change anything with regards to this problem, even though it applied the new skin to the page. When we really changes the skin, it started working as it should.

[Maria Ilieva]

Hello Patrik,

Thank you for this update.

I'm glad that you have mentioned to isolate the problem on your side.
Do let us know if any new questions arise or if further help is needed.

All the best,
Maria Ilieva
the Telerik team

[improwise]

Please note the question about regarding Telerik and DotNetNuke integration:

Something that would be really helpful would be if you could write (or point me to if it already exists) a "How to integrate Telerik into DotNetNuke". We've looked at http://www.telerik.com/help/aspnet-ajax/what-is-dnn.html but it doesnt seem to do more than scratch the surface on that subject when you are a full Telerik customer (ie not just using the Telerik components distributed with DotNetNuke). Some of the unanswered questions I feel are:

1. Should you replace the default ScriptManager with RadScriptManager? Pros/cons?
2. Should you use the Form.Controls.Add(New Telerik.Web.UI.RadStyleSheetManager())  to register the RadStyleSheetManager or is it enough to just drag and drop a RadStyleSheetManager on the user control?
3. How should you setup your DotNetNuke modules, with regards to Telerik? Should the DotNetNuke.Framework.AJAX.RegisterScriptManager() be used?
4. Should you use the "supports partial rendering" on the module definition of the module (which wraps the entire module in an updatepanel) or should that he avoided when using Telerik equivalents (I assume so but still)

[Maria Ilieva]

Hello Patrik Johansson,

1. It is not necessary to replace the default asp ScriptManager with RadScriptManager.
2. Dragging and dropping the RadStyleSheetManager is enough to have it working correctly in the module.
3. It is not necessary to use the DotNetNuke.Framework.AJAX.RegisterScriptManager()
4. It is obligatory not to enable the supports partial rendering in versions of DNN after 5.0 as this will add additional UpdatePanel around the module which may lead to problems with ajaxifying inner controls.

I hope this answers your questions.


Regards,

Maria Ilieva
the Telerik team

 

[improwise]

Great, thanks for that information. I think you should consider putting into a help article or similar as I would guess there are quite many other developers thinking about this and who would be in need of the information. We've managed our self to gain this knowledge by trial & error and through quite time consuming search of information, and hopefully, not every developer would then have to do that.

[Maria Ilieva]

Hello Patrik,

Thank you for your feedback.

We will consider updating our DNN help topics for some of the future help builds and add some new information as per your suggestions.

Greetings,
Maria Ilieva
the Telerik team