Control static on page

Question

This question is a bit tricky, If something is not clear, please ask to explain.

This is happing on all pages that follow this logic:

• An asp:ValidationSummary on top of the page
• Some client side validators
• One Telerik RadUpload control

The problem happens when a client side validator is triggered and it's error message is displayed at the ValidationSummary control. Every control on the page "slides" down to create space for the ValidationSummary control, but the RadUpload stays in the same place and ends up on top of some other control.

If I force the browser to re-render the page (as an example change zoom to 125% and then back to 100%) the RadUpload is displayed where it was suposed to be (slided down to give space for the ValidationSummary control).

Does any one has a solution for this problem? Right now I am trying to use javascript to force the refresh, but it's not so trival...

Answer 1

It is highly probable that the problem lies with the page styling - there's the position: relative bug for IE . If there's a scrolling container, add position: relative to it and the problem should disappear.

Another option is to "redraw" the RadUpload control by calling a script like this:

var upload = document.getElementById('<%= RadUpload1.ClientID');
upload.style.cssText = upload.style.cssText;

or trigger IE's hasLayout by adding the following CSS:

.RadUpload { zoom: 1 !important }

(the selector depends on the suite version that you're using - I assume ASP.NET AJAX after Q1.2009)