<%@ Page Title="Basic Chunked Upload" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" %>
<%@ Register Assembly="AjaxUploader" Namespace="AjaxUploader.Controls" TagPrefix="au" %> 
<asp:Content ID="TitleContent" ContentPlaceHolderID="TitleContent" runat="server">Basic Chunked Upload - AjaxUploader v5.0 Demos</asp:Content>
<asp:Content ID="HeaderContent" ContentPlaceHolderID="HeaderTitle" runat="server">Basic Chunked Upload</asp:Content> 
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server"> 
<div class="demo-card"> <div class="demo-card-header">Basic Chunked Upload</div> <div class="demo-card-body"> <p class="demo-description"> Chunked uploading splits large files into smaller pieces and sends them
 sequentially. This improves reliability and allows resuming failed uploads.
 Enable it with <code>EnableChunkedUpload="true"</code>.
 </p> <au:AjaxFileUpload ID="Uploader1" runat="server"
 EnableChunkedUpload="true"
 ChunkSize="1048576"
 AllowMultiple="true"
 ShowProgress="true" /> <h5 class="mt-4">How It Works</h5> <ol> <li>The file is split into chunks (default 1 MB each)</li> <li>Each chunk is sent as a separate HTTP request to the chunk URL</li> <li>The server reassembles chunks in order</li> <li>Progress is tracked across all chunks for a smooth experience</li> </ol> <h5>JavaScript API Equivalent</h5> <div id="jsChunkedUploader" style="margin-top:0.5rem;"></div> <div class="code-panel"> <pre><code>&lt;au:AjaxFileUpload ID="Uploader1" runat="server"
 EnableChunkedUpload="true"
 ChunkSize="1048576"
 AllowMultiple="true"
 ShowProgress="true" /&gt;

// JavaScript API approach
AjaxUploader.create(el, {
 uploadUrl: '<%= ResolveUrl("~/ajaxupload.axd/chunk") %>',
 chunked: true,
 chunkSize: 1048576,
 multiple: true,
 autoUpload: true
});</code></pre> </div> </div>
</div> 
</asp:Content> 
<asp:Content ID="ScriptsContent" ContentPlaceHolderID="ScriptsContent" runat="server">
<script> AjaxUploader.create(document.getElementById('jsChunkedUploader'), {
 uploadUrl: '<%= ResolveUrl("~/ajaxupload.axd/chunk") %>',
 chunked: true,
 chunkSize: 1048576,
 multiple: true,
 autoUpload: true,
 onTaskProgress: function (task, pct) {
 console.log(task.fileName + ': ' + Math.round(pct) + '%');
 },
 onTaskComplete: function (task) {
 console.log(task.fileName + ' upload complete');
 }
 });
</script>
</asp:Content>
