ASP.NET 3.5 and above only

Obout.Ajax.UI Controls - File Upload - Inside FormView control

Here you can upload up to 10 MB of images on asynchronous postback.
Click 'Edit' to see FileUpload.

Edit
Order: 11077
Name: R00anyon Grocery
City: Albuquerquesdsd
Region: NM
Country: Portugal2
Postal Code: 871101


The full source code of this example you can find in the downloaded Suite.
ASP.NET
<%@ Register Assembly="Obout.Ajax.UI" Namespace="Obout.Ajax.UI.FileUpload" TagPrefix="obout" %>
<script type="text/JavaScript">
  function onClientBeforeUpload(sender, args) {
      $get("<%= label.ClientID %>").innerHTML = "";
      return true;
  }
  function cancelFileUpload() {
      // find FileUpload
      var fileUpload = $find('<%= FormView1.FindControl("fileUpload1").ClientID %>');
      if (fileUpload && fileUpload._filesList) {
          // can not cancel already
          if (fileUpload.get_isInProgress()) {
              return false;
          }
          // reset files list
          fileUpload._filesList.clear(true);
      }
      return true;
  }
</script>
...
<asp:UpdatePanel runat="server" ID="UpdatePanel1"><ContentTemplate>
<asp:FormView ID="FormView1" runat="server" DataSourceID="XmlDataSource1" OnItemUpdated="myItemUpdated" >
<ItemTemplate>
<table style="width:100%">
<tr>
<td colspan="2">
<asp:linkbutton id="Edit" text="Edit" commandname="Edit" runat="server" /></td></tr>
                <tr>
                    <td class="tdText" valign="top"><b>Order:</b></td>
                    <td class="tdText" valign="top" align="right">
                        <asp:Literal runat="server" Text='<%# Eval("OrderID") %>' />
                    </td></tr>
                ...
                <tr>
                    <td class="tdText" valign="top"><b>Postal Code:</b></td>
                    <td class="tdText" valign="top" align="right">
                        <asp:Literal runat="server" Text='<%# Eval("ShipPostalCode") %>' />
                    </td></tr>
            </table>
<%--We need invisible FileUpload here for correct work--%>
<obout:FileUpload Visible="false" runat="server" id="fileUpload1"
          ValidFileExtensions="jpeg;jpg;gif;tiff;png" MaximumTotalFileSize="10240" />
</ItemTemplate>
<EditItemTemplate>
<table style="width:100%">
<tr>
<td><asp:linkbutton id="Update"
text="Update" commandname="Update" runat="server"/></td>
<td><asp:linkbutton id="Cancel" OnClientClick="return cancelFileUpload();"
text="Cancel" commandname="Cancel" runat="server"/></td></tr>
                <tr>
                    <td class="tdText" valign="top"><b>Order:</b></td>
                    <td class="tdText" valign="top" align="right">
<asp:textbox id="OrderID" text='<%# Bind("OrderID") %>' runat="server" ReadOnly="true" />
                    </td></tr>
                ...
                <tr>
                    <td class="tdText" valign="top"><b>Postal Code:</b></td>
                    <td class="tdText" valign="top" align="right">
<asp:textbox id="ShipPostalCode" text='<%# Bind("ShipPostalCode") %>' runat="server"/>
                    </td></tr>
<tr>
<td colspan="2">
<obout:FileUpload OnClientBeforeUpload="onClientBeforeUpload" Accept="image/*"
          ValidFileExtensions="jpeg;jpg;gif;tiff;png" MaximumTotalFileSize="10240"
          Width="250px" runat="server" id="fileUpload1" BrowseFieldDescription="Images"
/>
</td></tr>
            </table>
</EditItemTemplate>
</asp:FormView><br /><br />
<asp:Label runat="server" ID="label" Text="" />
</ContentTemplate></asp:UpdatePanel>

"Thank you very much, your suite is amazing. It´s been a long time I´m trying to do this effect and asked the suport from others suites and none of them could do it works. Great product."

A.G.Junior
Fiorilli Software

Random testimonial   All testimonials