ASP.NET 3.5 and above only

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

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

  Edit
Order:11077
Name:Rattlesnake Canyon Grocery
City:Albuquerquesdsd
Region:NM
Country:Portugal
Postal Code:87110
 


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('<%= DetailsView1.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:DetailsView ID="DetailsView1" runat="server" DataSourceID="SqlDataSource1"
          OnItemUpdated="myItemUpdated" Width="350px" AutoGenerateRows="false" >
        <Fields>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:linkbutton id="Edit" text="Edit" commandname="Edit" runat="server"/> 
                </ItemTemplate>
                <EditItemTemplate>
                    <asp:linkbutton id="Update" text="Update" commandname="Update" runat="server"/>
                    <asp:linkbutton id="Cancel" OnClientClick="return cancelFileUpload();" text="Cancel"
                          commandname="Cancel" runat="server"/> 
                </EditItemTemplate>
            </asp:TemplateField>
            <asp:BoundField DataField="OrderID" HeaderText="Order:" />
            ...
            <asp:BoundField DataField="ShipPostalCode" HeaderText="Postal Code:" />
            <asp:TemplateField>
                <ItemTemplate>
                    <%--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>
                    <obout:FileUpload OnClientBeforeUpload="onClientBeforeUpload"
                               ValidFileExtensions="jpeg;jpg;gif;tiff;png" MaximumTotalFileSize="10240"
                               Width="250px" runat="server" id="fileUpload1" BrowseFieldDescription="Images" />
                </EditItemTemplate>
            </asp:TemplateField>
        </Fields>
    </asp:DetailsView><br /><br />
    <asp:Label runat="server" ID="label" Text="" />
</ContentTemplate></asp:UpdatePanel>

"Just check it out, and see the demo.., The new grid is rock.. Like it very much... You guys always come with the new thing... Drag and drop column header.. is amazing..and the performance is still the best Thank you very much"

Husain Ahmad

Random testimonial   All testimonials

Products Downloads