Add a RadProgressArea inside the Upload dialog

Thread is closed for posting
12 posts, 0 answers
  1. 63F75A2C-1F16-4AED-AFE8-B1BBD57646AD
    63F75A2C-1F16-4AED-AFE8-B1BBD57646AD avatar
    1572 posts
    Member since:
    Oct 2004

    Posted 25 Jan 2010 Link to this post

    Requirements

    RadControls version RadControls for ASP.NET AJAX
    .NET version
    .NET 3.5
    Visual Studio version

     

    2008
    programming language JavaScript/C#
    browser support

    all browsers supported by RadControls


    PROJECT DESCRIPTION
    How to embed a RadProgressArea inside the Upload window.

    THE RESULT



    UPDATE:
    Since Q1 2013 RadFileExplorer exposes a property allowing you to use the built-in progress area of RadAsyncUpload. In order to enable this feature, you will need to set RadFileExplorer's Configuration-EnableAsyncUpload property to true.

  2. 996383D6-ABEE-4F86-9A70-4348DAAD8057
    996383D6-ABEE-4F86-9A70-4348DAAD8057 avatar
    13 posts
    Member since:
    Apr 2010

    Posted 08 Apr 2010 Link to this post

    Hi,

    I tried this method in my project and I got this error:

    Error 3 An object reference is required for the non-static field, method, or property 'System.Web.UI.Control.ClientID.get'

    Can I know what's the problem and how to solve it?

    Thanks
    Muhammad Farjad
  3. 93B1DAB4-A7A5-479B-85C2-CAC0407F59F5
    93B1DAB4-A7A5-479B-85C2-CAC0407F59F5 avatar
    1633 posts
    Member since:
    Sep 2012

    Posted 13 Apr 2010 Link to this post

    Hi Muhammad,

    I tested the attached project and it is working as expected. Could you please open a support ticket and provide a sample project that reproduce the mentioned problem so we can investigate it further?

    In addition, the most common reason for this error to occur is if you are trying to access a non-static property inside a static method - to avoid this you need to a reference to an instance of the object whose property you are trying to access.

    Kind regards,
    Dobromir
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  4. 996383D6-ABEE-4F86-9A70-4348DAAD8057
    996383D6-ABEE-4F86-9A70-4348DAAD8057 avatar
    13 posts
    Member since:
    Apr 2010

    Posted 14 Apr 2010 Link to this post

    Hi Dobromir,

    I found out the problem myself, it was a childish mistake that caused the error. But now I am having a new problem :-), I have opened a support ticket for it. Have a look at it, your help will be appreciated. Thanks

    Regards
    Muhammad Farjad
  5. 4BF77085-EC2B-46B7-AF4F-2D816505BF45
    4BF77085-EC2B-46B7-AF4F-2D816505BF45 avatar
    7 posts
    Member since:
    Dec 2006

    Posted 16 Nov 2010 Link to this post

    Its works perfect but i do not see the uploader if in IE7 if i set it online,
    offline it works perfect in IE7, online it works also in IE8 / FireFox / Crhome ...

    does anyone has an idea?

    regards
    Wouter
  6. 93662917-1E03-49EC-9286-033C9D1BF79E
    93662917-1E03-49EC-9286-033C9D1BF79E avatar
    1406 posts
    Member since:
    May 2014

    Posted 19 Nov 2010 Link to this post

    Hello Woutercop,

    I am not quite sure what is causing the problem in IE7. It looks like a permission issue related to the browser's settings, so I recommend you to try these steps:
    • Restore default settings of the browser
    • Uninstall all browser addons and try the page again

    In case that the suggested did not help, could you please send a live URL where we can try to isolate the issue?

    Kind regards,
    Fiko
    the Telerik team
    Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  7. AB8DBC65-0474-4D90-8126-DA85287A3E01
    AB8DBC65-0474-4D90-8126-DA85287A3E01 avatar
    16 posts
    Member since:
    Jun 2009

    Posted 09 Dec 2010 Link to this post

    Greetings,

    I am looking for the same functionality when uploading files. However, the example appears to "simulate" a progress bar as it is updated at a time interval versus the actual amount of data that is uploaded. While it looks nice, it is not truthfully showing users how much time uploading smaller files versus larger files will take. The progress bar ticks along at the same pace regardless of the size of the file being uploaded.

    Is there a way to refer to the total bytes uploaded from within the "RadFileExplorer1_ItemCommand" function in the example? Or any other solution that would resolve this? I have been looking for some time now but am unable to figure it out.

    Thank you kindly for your time.
    Darren
  8. 93662917-1E03-49EC-9286-033C9D1BF79E
    93662917-1E03-49EC-9286-033C9D1BF79E avatar
    1406 posts
    Member since:
    May 2014

    Posted 15 Dec 2010 Link to this post

    Hi Darren,

    The example simulates uploading a large file and this i for demonstration purpose. You will get the desired result however, if you remove the ItemCommand handler and really upload a large file. I have prepared a screencapture of a real scenario, with uploading a big file. The video is attached to this thread.

    Regards,
    Fiko
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  9. BEFB142D-F0A1-4873-80B8-1A26B215B7B0
    BEFB142D-F0A1-4873-80B8-1A26B215B7B0 avatar
    14 posts
    Member since:
    Aug 2009

    Posted 14 Jan 2011 Link to this post

    Hello,

    I have implemented the example code and I am able to upload small files, but if I attempt a large file (that is still under the max file size I specified) I get the below error.  This one is from Chrome, IE gave a much less descriptive error:

    This webpage is not available

    The webpage at http://localhost:50637/default.aspx?RadUrid=f01aca1b-0aa4-45dd-bca2-c65d14650e34 might be temporarily down or it may have moved permanently to a new web address.
    Error 101 (net::ERR_CONNECTION_RESET): Unknown error.


    Any ideas as to what would cause this or am I missing something?  Similar to the video, I specified a max of 1000MB and attempted to upload a 107MB file.  I did not paste any code because I didn't change anything from the demo.

    Thanks for your help!

    John
  10. 93B1DAB4-A7A5-479B-85C2-CAC0407F59F5
    93B1DAB4-A7A5-479B-85C2-CAC0407F59F5 avatar
    1633 posts
    Member since:
    Sep 2012

    Posted 19 Jan 2011 Link to this post

    Hi John,

    This error might occur if the uploaded file's size exceed the maximum allowed file size of the ASP.NET. Could you please verify that you have set maxRequestLength property to the <httpRuntime> in the web.config.

    In the video posted by Fiko, you can see that this value is set to 2GB
    <httpRuntime maxRequestLength="2097152" />.

    You can find more information regarding httpRuntime section in the following article:
    http://msdn.microsoft.com/en-us/library/e1f13641%28v=vs.71%29.aspx

    Regards,
    Dobromir
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  11. BD45110C-03D5-4C47-A17A-83416745328B
    BD45110C-03D5-4C47-A17A-83416745328B avatar
    29 posts
    Member since:
    Jan 2012

    Posted 06 Sep 2012 Link to this post

    Hi guys,

    The code works fine, but i have found an issue: if the user clicks the 'Cancel' button to cancel the upload, the ProgressArea disappears, while the Upload window stays. This is fine, but the 'Upload' button of the Upload window is not visible anymore.

    How can I make the 'Upload' button to be visible again once the user has canceled the upload?

    Thank you,
    Joaquín


    I have managed to find a solution to this, but as long as my programming skills are quite poor, could you please advice if this solution is acceptable? I have modified the uploadWindowShown function like this:

    function uploadWindowShown(oWindow, args) {
                if (oWindow.get_title() == "Upload") {// The upload window
                    oWindow.moveTo(200, 100);

    //Find the RadProgressArea 
                    var progressArea = $find("<%= RadProgressArea1.ClientID %>");
                    // Find the upload button in the Upload dialog 
                    var uploadBtn = $get("<%= RadFileExplorer1.ClientID %>_btnUpload");
                    // Find the cancel button in the RadProgressArea
                    var cancelBtn = progressArea._cancelButtonElement;

    //Hide or show the Upload button in the Upload dialog depending on if the ProgressArea is active
                    uploadBtn.onclick = function (e) { this.style.display = "none"; };
                    cancelBtn.onclick = function (e) { uploadBtn.style.display = "table-cell"; };

                    // Use the button to find the parent node
                    uploadBtn.parentNode.insertBefore(progressArea.get_element(), uploadBtn);
                }
            }
  12. E0B8B146-EE4E-4C4D-A1D5-BB2E6C929855
    E0B8B146-EE4E-4C4D-A1D5-BB2E6C929855 avatar
    2425 posts
    Member since:
    Apr 2022

    Posted 07 Sep 2012 Link to this post

    Hi Joaquín,

    There are some already known limitations of RadProgressArea. One of them is that the cancelling of the upload is not supported in Safary and, respectively, in Google Chrome.

    There is more detailed information on the subject available in the following link: RadProgressArea Known Limitations.

    Additionally, there is an available built-in AsyncUpload functionality in RadFileExplore where the progress monitoring is done in real time with no need of additional customizations (the cancelling of the upload is working properly in there). In order to enable it the EnableAsyncUpload property must be set to true.

    Kind regards,
    Veselina
    the Telerik team
    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 their blog feed now.
Back to Top

This Code Library is part of the product documentation and subject to the respective product license agreement.