12 Answers, 1 is accepted
I'll try that and get back to you.
But, I'm experiencing this issue on all browsers. It is very intermittent.
Please have a look at the page source code [images attached]. The RadAsyncUpload buttons and content is simply missing.
I cleared the cache and it was fine again. Any clue why this happens?
Try to disable all custom styles that you have on the page and test to see if the issue will disappear. If this suggestion doesn't help, then I will need more detailed information about your case:
- What is the version of Telerik assemblies that you are using?
- Does it happen on all browsers?
- What is your browser?
- Please paste your code here or include a link from where I can download your project.
Regards,
Hristo Valyavicharski
Telerik
We are not aware of such an issue. What is the exact version that you use? Please open a support ticket and attach a runnable sample project, which we could test locally. Also include the exact steps to reproduce the problem.
Regards,Hristo Valyavicharski
Telerik
On the page that is working:
<div class="row" style="float:left;height:100px;" align="left">
Add your file: <br /><telerik:RadAsyncUpload Width="450" InputSize="36" MaxFileInputsCount="1" EnableEmbeddedSkins="false" Skin="Web20" runat="server" ID="RadAsyncUpload1" AllowedFileExtensions="txt,csv,xls,xlsx" MultipleFileSelection="Disabled"
MaxFileSize="4194304" OnClientValidationFailed="validationFailed" UploadedFilesRendering="BelowFileInput" PostbackTriggers="lbtnAgree">
</telerik:RadAsyncUpload>
</div>
correctly renders as:
<div class="row" align="left" style="float:left;height:100px;">
Add your file…
<br></br>
<div id="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1" class="RadAsyncUpload RadUpload RadUpload_Web20" style="width:450px;">
<input id="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1_ClientState" type="hidden" name="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1_ClientState" autocomplete="off"></input>
<ul id="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1ListContainer" class="ruInputs">
<li id="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1row0">
<span class="ruFileWrap ruStyled">
<input id="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1fakeInput0" class="ruFakeInput radPreventDecorate" type="text" tabindex="-1" size="35"></input>
<label for="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1fakeInput0" style="display:none"></label>
<input class="ruButton ruBrowse" type="button" tabindex="-1" value="Select" style="border: 0px dotted;"></input>
<input id="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1file0" class="ruFileInput" type="file" tabindex="0" name="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1file0" size="36"></input>
<label for="ctl00_mainContentArea_wucListImport1_RadAsyncUpload1file0" style="display:none"></label>
</span>
<div class="ruDropZone"></div>
</li>
</ul>
</div>
</div>
and on the page that isn't working, the exact same code:
<div class="row" style="float:left;height:100px;" align="left">
Add your file: <br /><telerik:RadAsyncUpload Width="450" InputSize="36" MaxFileInputsCount="1" EnableEmbeddedSkins="false" Skin="Web20" runat="server" ID="RadAsyncUpload1" AllowedFileExtensions="txt,csv,xls,xlsx" MultipleFileSelection="Disabled"
MaxFileSize="4194304" OnClientValidationFailed="validationFailed" UploadedFilesRendering="BelowFileInput" PostbackTriggers="lnkUploadFile">
</telerik:RadAsyncUpload>
</div>
renders as:
<div class="row" align="left" style="float:left;height:100px;">
Add your file:
<br></br>
<div id="ctl00_mainContentArea_wucCreateEmail1_wucContentUpload1_RadAsyncUpload1" class="RadAsyncUpload RadUpload RadUpload_Web20" style="width:450px;">
<input id="ctl00_mainContentArea_wucCreateEmail1_wucContentUpload1_RadAsyncUpload1_ClientState" type="hidden" name="ctl00_mainContentArea_wucCreateEmail1_wucContentUpload1_RadAsyncUpload1_ClientState"></input>
</div>
</div>
Regards,
-Mark
Regards,
Mark
I'm glad to read that you were able to resolve your issue.
Regards,
Hristo Valyavicharski
Telerik
I had a similar issue. In my case, I had the JavaScript in the user control where I was using the RadAsyncUpload. Running the web app locally on my machine was working fine but on the server the control was not visible or usable. This thread led me to look for any errors and I did find where it was not finding the OnClientFileUploaded javascript function.
I moved it to my master page instead of in the user control and it started working normally.
while page loading, "RadAsyncUpload " control not rendering properly. it is not applying metrotouch css to file upload contorl for mili second.
following are the code information
<telerik:RadAsyncUpload ID="MyFile1" runat="server" MultipleFileSelection="Disabled" Skin="MetroTouch" EnableViewState="true" MaxFileInputsCount="1"
PostbackTriggers="rdbAccreditationCertificateYes,rdbAccreditationCertificateNo,rdbFirewallYes,rdbFirewallNo,rdbIRSYes,rdbIRSNo,rdbYes,rdbNo,Lnkproceed,LnkAddRow,lnkDelete,btnRemove,lnkBack,LnkSaveContinue">
<Localization Select="Browse" />
</telerik:RadAsyncUpload>
Please refer attached file
I have answered your question in the thread you have opened with the same question: while page loading, "RadAsyncUpload " control not rendering properly for millisecond. For convenience, I am also sharing the answer here
The behavior you are observing is called Flash of unstyled content and this is a common scenario especially when the styles are loaded externally and the internet connection is slow.
There are many approaches to deal with this and they depend on the given scenario and requirements of the project. For example, here are a few approaches you can try:
- Hard-code some initial styles in the <head> tag to style the desired controls until the stylesheets are loaded.
- Implement a "loading panel" with plain CSS, HTML and JS as explained in points 3. and 4. from the Page Transition Animation Code Library project
- Hide the body initially and show it on a convenient event: https://stackoverflow.com/questions/3221561/eliminate-flash-of-unstyled-content.
The last approach is not recommended as this might affect some controls that need their parent to be visible initially so that they can correctly calculate its size.
If any further questions related to the Flash of unstyled content arise, let us continue the discussion on the other thread.Regards,
Peter Milchev
Progress Telerik