ASP.NET AJAX Control Toolkit - Change Appearance of AsyncFileUpload Control?

I tried asking this at ASP.NET Forums but no one had a solution. I'm starting to think there isn't one.

What I'd like to do is customize the look and size of the AsyncFileUpload control's 'Browse' button while hiding its textbox. Alternatively, hiding the AsyncFileUpload entirely and calling its functionality from a button whose look I can customize would be splendi开发者_如何学God too.

---

You can still use the solution that SLaks offered even for AsyncFileUpload control.

The code:

<div id="fileUploadDiv">
    <asp:AsyncFileUpload ID="AsyncFileUpload1" runat="server" />
</div>

will be rendered this way:

<div id="fileUploadDiv">    
    <span id="MainContent_AsyncFileUpload1">    
        <input type="hidden" name="ctl00$MainContent$AsyncFileUpload1$ctl00" id="MainContent_AsyncFileUpload1_ctl00" />    
        <div id="MainContent_AsyncFileUpload1_ctl01" name="MainContent_AsyncFileUpload1_ctl01">    
            <input name="ctl00$MainContent$AsyncFileUpload1$ctl02" type="file" id="MainContent_AsyncFileUpload1_ctl02" id="MainContent_AsyncFileUpload1_ctl02" onkeydown="return false;" onkeypress="return false;" onmousedown="return false;" style="width:355px;" />    
        </div>    
    </span>    
</div>

Therefore by using a CSS selector #fileUploadDiv input[type=file] you can modify the style of the AsyncFileUpload control the same way you do it with regular <input type='file'> element.

I blogged about this solution in more details here.

---

Maybe this is a bit in left field, but perhaps a better solution would be to use a Flash-based solution. There are a few that are specifically made for ASP.NET and apparently have a fair amount of customization.

• Multiple File Upload With Progress Bar Using Flash
• ASP.NET Flash File Uploader

It's not a solution to your problem directly, but another way to achieve similar results.

---

This method worked for me.

http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom

---

By setting the opacity of the control, and adding any other controls with equal size you can maintain whatever view you want.

Please find this reference:

http://blog.rptea.com/post/Customize-AsyncFileUpload-(MS-ajax-control-toolkit-)-cross-browser-too.aspx