How to Modify the Async Upload

[Brian]

Greetings,

 

I am utilizing FileExplorer, including the built-in async upload feature. When you click Upload on the FileExplorer toolbar, a window is displayed, allowing users to select files on their local machines, and upload them to our Internet site.

 

I would like to know if it is possible to modify the window that is displayed by the Upload toolbar button. We find that some users are confused by this window. They seem to grasp the idea of clicking [Select] and picking files they wish to upload. The confusion comes as they watch the progress bar and the dot change color from yellow to green. Some users think the upload is complete at that point, and they often click the X in the upper-right of the window, instead of clicking the [Upload] button at the bottom of the window. Of course, when they click the X instead of the [Upload] button, their files do not appear in FileExplorer. So I would like to modify the upload window and make it more obvious as to what must be done in order to have a more successful experience.

 

For starters, I would like to hide the X in the upper-right of the upload window. Then I would like to add a label on the window that reads something like, “Step 1: Click [Select] to choose the files to upload.” It would be nice if the progress of each file appeared between the [Select] button and the [Upload] button.

 

Since the progress bar and green dot give some users the impression that the files are already uploaded, I would like to add another label that reads, “Click [Upload] to complete this process”. And I would like to change the text of the Upload button to read [OK], instead of [Upload].

 

And since I would like to hide the X in the upper-right, I would like to add a [Cancel] button next to the [OK] button.

 

Are any of these modifications possible? If so, can you point me to some examples that I can use to get started?

 

Thank you,

Steven

[Vessy]

Hi Steven,

Currently the mentioned modifications to the RadFileExplorer's Upload dialog are not a trivial task, but the good news is that we are planning to give our clients an opportunity to use external dialogs in a similar to the RadEditor way (refer this link for more information). Unfortunately, I am not able to give you any firm estimation for when this feature will be available, but most probably it would be implemented for one of the next up-coming releases.

For the time being, I could give you the following directions:
1. You could control the button, closing the upload dialog by configuring its behaviors in the desired way.

//after the upload dialog is shown
setTimeout(function () {
    var oWnd = explorer.get_windowManager().getActiveWindow();
    oWnd.set_behaviors(Telerik.Web.UI.WindowBehaviors.None);
}, 100);

In spite of that, I would recommend you simply to attach some kind of warning to the upload dialog's OnClientBeforeClose() Client event where to warn the user that its files are not uploaded.

2. Regarding the additional labels which you want to add to the dialog, I suggest you to review the following forum tread on the subject: Simple text message in upload window

3. In reference to your last question - in order to change the text on the upload button to "OK" you will need to modify the value for that button in the FileExplorer's Localization files. More information on how that could be done is available here: Localization.

I hope this information was helpful for you.

Kind regards,
Vesi
the Telerik team

[runbkk]

I agree, this is also incredibly confusing to our users. Users see the progress bar go all the way then close the window rather than clicking "upload", then wonder why the files are not there.