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

Upload Dialog

11 Answers 333 Views

FileExplorer

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

Justin Hunter asked on 20 Aug 2010, 03:28 PM

radfileexplorer-upload.JPG

I am implementing the RadFileExplorer on a page and I can't figure out how to do a few things with the upload file dialog.

I have attached an image of the upload dialog associated with the control for reference to what I'm requesting.

Firstly, I would like to remove the div that holds:

Max file size allowed:
File extensions allowed:

And secondly, I would like to remove the checkbox, and text associated with 'Overwrite if file exists?'

And thirdly, the upload button at the very bottom does not follow my skin of WebBlue.

11 Answers, 1 is accepted

answered on 25 Aug 2010, 12:59 PM

changeuploaddialog.zip

Hi Justin,

I have prepared a demo for your which shows how to achieve the desired result. Could you please check it and let me know whether it fits your requirements?

In addition, I recommend you to check this forum thread as well.

Best wishes,
Fiko
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

answered on 30 Aug 2010, 09:51 AM

skinningtheuploadbutton.zip

Hi Justin,

I am not quite sure what is causing the undesired behavior on your side. I have tested with the Q2 2010 and Q2 2010 SP1 versions of the controls and the button is skinned properly. I have attached a video of my test (I have added a RadSkinManager in order to change the skins).

In your case I suppose that you use an older version of the controls than the ones mentioned above and this is causing the undesired behavior. If so, could you please paste the exact version number of the Telerik.Web.UI assembly that you use?

All the best,
Fiko
the Telerik team

answered on 30 Aug 2010, 02:46 PM

I am using 2010 Q2, and am about to install the new RadControls that come come out less than a week ago.

I think my issue may be that I'm opening the RadFileExplorer in a RadWindow, and when the upload button is clicked it's yet another RadWindow. Perhaps I'm not setting up my RadWindow correctly.

Below is the code for declaring the RadWindow:

<telerik:RadWindow runat="server" Width="750px" Height="600px" VisibleStatusbar="false"

Skin="WebBlue" NavigateUrl="~/admin/PopUpForms/Explorer.aspx" ID="ExplorerWindow"

Modal="true" Behaviors="Close,Move">

</telerik:RadWindow>

Below is the code for the button that launches the RadWindow:

<asp:Button ID="btnTopicLocation" runat="server" Text="Attach PDF" OnClientClick="OpenFileExplorerDialog(); return false;" />

And the Javascript function that the above calls:

function OpenFileExplorerDialog() {

var wnd = $find("<%= ExplorerWindow.ClientID %>");

wnd.show();

}

answered on 01 Sep 2011, 11:45 AM

Hello Steve,

I answered your question in your support ticket on the subject. Here is the proposed solution:

Currently there is an easy workaround that will help you to apply a black background to the Upload dialog of RadFileExplorer and it is the following CSS class and RadFormDecorator:

Copy Code

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<style type="text/css">

.rfeUploadInfoPanel

{

color: black !important;

font-family: "Segoe UI",Arial,sans-serif;

font-size: 12px;

}

</style>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />

<telerik:RadFormDecorator ID="FM" runat="server" Skin="Black" DecoratedControls="All"/>

<telerik:RadFileExplorer ID="RadFileExplorer1" runat="server" Skin="Black">

<Configuration ViewPaths="~/" UploadPaths="~/" DeletePaths="~/" />

</telerik:RadFileExplorer>

</form>

</body>

</html>

Best regards,
Rumen
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

answered on 26 Feb 2013, 07:15 AM

Hello,

I have already answered your support ticket on the subject, but for convenience I will paste my answer here as well:

You could directly hide the "Add" button, bu I recommend you to use the Upload's control MaxFileInputsCount property, which allows you to set the maximum count of the uploaded files. With this approach the "Add" button will be only disabled, but the users will be able to use it if an input has been removed before that.

VB:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

RadFileExplorer1.Upload.MaxFileInputsCount = 3

End Sub

Nevertheless, if you still prefer hiding the button, instead of disabling it, you could do it in a similar way:

function OnToolBarButtonClicked(oToolbar, args) {

var toolbarItem = args.get_item();

if (toolbarItem.get_value() == "Upload") {// upload is clicked

var uploadContainerID = "<%= RadFileExplorer1.ClientID %>_uploadContainer";

var uploadContainer = $telerik.$("#" + uploadContainerID).get(0); // Find the uplaod RadWindow's UploadContainer

var fileExplorerClientId = "<%= RadFileExplorer1.ClientID %>"; // the client id of the RadFileExplorer

var chbClientId = fileExplorerClientId + "_chkOverwrite"; // override checkbox clientid

var infoPanel = $telerik.$(".rfeUploadInfoPanel", uploadContainer); // Find the upload info

infoPanel.css("display", "none"); // hide it

var chBox = $telerik.$("#" + chbClientId, uploadContainer);

chBox.css("display", "none"); // hide the checkbox

var oLabel = $telerik.$("label[for='" + chbClientId + "']", uploadContainer);

oLabel.css("display", "none"); // hide the label of the checkbox

var upload1AddButtonId = fileExplorerClientId + "_upload1AddButton"; // Decorated button

var upload1AddButton = $telerik.$("#" + upload1AddButtonId, uploadContainer); // Find the Upload button. It is decorated

upload1AddButton.css("display", "none");

var undecoratedButtonId = fileExplorerClientId + "_btnUpload"; // Undecorated button

var undecoratedButton = $telerik.$("#" + undecoratedButtonId, uploadContainer); // Find the undecorated button

undecoratedButton.addClass(upload1AddButton.attr("class")); // Copy the classes from the decorated button to the undecorated one

var embededUpload = $find(fileExplorerClientId + "_upload1");

$telerik.$(embededUpload.get_element()).append(undecoratedButton); // Move the undecorated button to inside the RadUpload control

}

All the best,
Vesi
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.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Upload Dialog

11 Answers, 1 is accepted