This is a migrated thread and some comments may be shown as answers.

RadAsyncUpload doesn't render sometimes

12 Answers 129 Views
AsyncUpload
This is a migrated thread and some comments may be shown as answers.
Aref
Top achievements
Rank 1
Aref asked on 12 Aug 2013, 07:29 AM
Hi

The upload controls (buttons) don't render sometimes. It happens a couple of times and then works after a while.
I'm using 2012.3.1308.35.
Any idea what the causes may be?

12 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 1
answered on 12 Aug 2013, 09:02 AM
Hi Aref,

Please have a look at this documentation on RadAsyncUpload buttons visibility issue.

Hope this helps,
Shinu.
0
Aref
Top achievements
Rank 1
answered on 12 Aug 2013, 10:43 AM
Thanks for the quick response.
I'll try that and get back to you.
But, I'm experiencing this issue on all browsers. It is very intermittent.
0
Aref
Top achievements
Rank 1
answered on 14 Aug 2013, 11:05 AM
I've managed to reproduce the problem [which was very difficult]
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?
0
Hristo Valyavicharski
Telerik team
answered on 19 Aug 2013, 10:52 AM
Hi Aref,

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.
This will allow me to debug your code locally and troubleshoot the issue.

Regards,
Hristo Valyavicharski
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Jason
Top achievements
Rank 1
answered on 21 Aug 2013, 07:50 PM
I am experiencing this same issue currently. My RadAsyncUpload control seems to just randomly not render.  As far as I can tell, the control gets rendered to the page after it loads through a WebResource.axd ajax call that returns application/x-silverlight-2 data.  In the instances where the control doesn't render to the page, I am not seeing the WebResource.axd file in my captured network traffic at all.  It's like it just didn't do the callout. (I'm using IE9's developer tools to capture what files get called when a page loads, but I've noticed this happening when I view the page in other browsers as well.)
0
Hristo Valyavicharski
Telerik team
answered on 27 Aug 2013, 10:07 AM
Hi Jason,

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
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Mark Kucera
Top achievements
Rank 1
answered on 18 Dec 2013, 05:18 AM
was this issue ever resolved?  I seem to have this happen as well, except for me it's not random.  on one page the asyncupload control works perfectly and on another page i get this exact same issue. 

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
0
Mark Kucera
Top achievements
Rank 1
answered on 18 Dec 2013, 05:34 AM
Sorry, i looked at this for about an hour before i posted this, but i just found my error. Going to update here in case it helps someone else has this issue.  come to find out i'd declared a client side validation method, which i thought was included globally, but it wasn't it was declared at the page level, and i hadn't put the method on my page that wasn't working.  When i added the validation method it worked. I finally found a tiny message in my debugger that said "validationFailed" not found.

Regards,
Mark
0
Hristo Valyavicharski
Telerik team
answered on 20 Dec 2013, 04:00 PM
Hi Mark,

I'm glad to read that you were able to resolve your issue.

Regards,
Hristo Valyavicharski
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Jerry
Top achievements
Rank 2
answered on 26 Jul 2017, 01:57 PM

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.

 

0
anup
Top achievements
Rank 1
answered on 06 Mar 2019, 02:57 PM

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

0
Peter Milchev
Telerik team
answered on 11 Mar 2019, 09:47 AM
Hello Anup,

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: 

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
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
AsyncUpload
Asked by
Aref
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 1
Aref
Top achievements
Rank 1
Hristo Valyavicharski
Telerik team
Jason
Top achievements
Rank 1
Mark Kucera
Top achievements
Rank 1
Jerry
Top achievements
Rank 2
anup
Top achievements
Rank 1
Peter Milchev
Telerik team
Share this question
or