File upload with ASP.NET AJAX UpdatePanel

I’ve been working with the Microsoft AJAX toolkit recently (and not so much Windows Mobile – hence lack of update . It’s an amazing framework for people who don’t know much JavaScript but still would like to do some AJAX style web programming (like me). However since it involves a combination of .NET server side programming, HTML and client side JavaScript figuring out what’s wrong when something doesn’t work can be tricky. I’ll try to post a few tricks I found (mostly on ajax.asp.net  :) even though it’s not directly related to mobile programming.

The ASP.NET FileUpload control doesn’t work within an AJAX UpdatePanel by default (when the upload button you create is inside the same panel). This is because a file cannot be uploaded asynchronously. To be able to upload a file the easiest solution is to make a complete postback when the user uploads a file. To do this add a PostBackTrigger on the button:

<asp:UpdatePanel>
  <ContentTemplate>
<asp:Button ID="ButtonUploadFile"
    runat="server" Text="Upload" />
</ContentTemplate>
  <Triggers>
<asp:PostBackTrigger ControlID="ButtonUploadFile" />
  </Triggers>
</asp:UpdatePanel>

(note that it is not an AsyncPostBackTrigger)