CODEWITHSUNDEEP
asp.nethtmlajaxasp.net-ajax
Keerigan
Keerigan

Reputation: 1192

Changing the button of the ajaxtoolkit:AsyncFileUpload

I am using the ajaxtoolkit:AsyncFileUpload, and I was wondering if there is even a way to change the button that goes along with it? 

<ajaxtoolkit:AsyncFileUpload Width="200" ID="filImageUpload" ThrobberID="imgUploadProgress" 
    OnUploadedComplete="filImageUpload_UploadComplete" 
    OnClientUploadComplete="filImageUpload_UploadImageComplete"   
    OnClientUploadStarted="filImageUpload_UploadStarted"
    OnClientUploadError="filImageUpload_UploadError" 
    UploaderStyle="Traditional" CompleteBackColor="LightGreen" ErrorBackColor="Red" runat="server" />

Is there another attribute that will allow me to change it that I am missing? Or can I change it using CSS?

I know that when it renders I get and input element, but I don't know if I am able to change that text through that in CSS either.

Any help will be appreciated

Upvotes: 1

Views: 8055

Answers (2)

aligjonatas
aligjonatas

Reputation: 21

Just do that:

$("#AsyncFileUpload1").find('div').css('background', 'transparent');

$("#AsyncFileUpload1").find('div').css('background-image', 'url("Images/btnSelecionar.jpg")');

Replace AsyncFileUpload1 by your ControlId.

Works fine for me! =)

Upvotes: 1

Keerigan
Keerigan

Reputation: 1192

Not a real fix, but by changing the UploaderStyle="Traditional" to UploaderStyle="Modern", you will be able to make the button an image instead. You can then add a CssClass to the AsyncFileUpload and add a background image through the style sheets.

.AFU
{
 position: relative;
 float: left;
 clear: both;
 top: 0px;
 padding-left: 0px;
 padding-right: 0px;
 width: 200px;
 border:thick;
 margin:0px;
 background: url("Your/Path/Here") no-repeat 100% 1px;
}

Upvotes: 4

Related Questions