We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to turn off (hide) the file size, upload status, upload progress & percentage and delete/refresh button from the Upload Box control ?

Platform: ASP.NET MVC (Classic) |
Control: UploadBox |
Published Date: November 21, 2014 |
Last Revised Date: December 4, 2014 |
Product Version: 12.1.0.43
Tags: uploadbox

Description

Need to turn off (hide) the file size, upload status, upload progress & percentage and delete/refresh button from the Upload Box control.

Solution

You are maintaining a separate CSS class for each part in upload file size details. So you need to override the CSS with display property. To avoid unwanted CSS overridden on multiple Upload Box controls in the same page, you should override the CSS based on the specific Upload Box control ID.

The following table shows the details of file info parts and its corresponding classes

File Info Part

CssClass

File status

file-status

 

File Size

file-size

 

File Percentage

file-percentage

 

Delete/Refresh icon

file-action

 

File Progress bar

File-progress-bar

Example

In the following example, the Delete/Refresh Icon in Uploaded file details is hidden.

  1. Render the Upload box control in View page with using the following code example.

View

  1. The following table explains you the details of CSS and its output

Query

Corresponding CSS

Result

How to turn off the Delete/Refresh icon?

#upload .file-action

{

    display:none;

}

#upload => Upload box ID

How to turn off the File percentage?

#upload .file-percentage

{

             display:none;

}

#upload => Upload box ID

How to turn off the File size?

#upload .file-size

{

             display:none;

}

#upload => Upload box ID

How to turn off the File status?

#upload .file-status

{

             display:none;

}

#upload => Upload box ID

How to turn off the File Progress bar?

#upload .file-progress-bar

{

             display:none;

}

#upload => Upload box ID

 

 

ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon