<%@ Page language="c#" Codebehind="UploadWithProgressBar.aspx.cs" AutoEventWireup="True" Inherits="EAUploadExamples.UploadWithProgressBar" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Upload with progress bar</title>
<link rel="stylesheet" href="ExamplesStyle.css">
<script type="text/javascript" src="JSCore.js"></script>
<script type="text/javascript">
/* NOTE: Functions GetUploadId(), CreateProgressWindow()
are defined in JSCore.js file of EAUpload distribution package.*/
var progressWindow;
// Handles a button click, prepares for sending and submits a form.
function doUpload()
{
// Get an unique identifier that will be used by EAUploadModule
// for creating a new instance of Upload class.
// You should provide an UploadId for file processing page and
// for page that is used for retrieving a status information.
var UploadId = GetUploadId();
// Add an unique identifier to query string. EAUpload retrieves this value and
// uses it as an unique identifier of an Upload class instance. So, now we can get an access
// to required Upload object by this id from any page within the application.
// Function "RefreshQueryString" is defined in JSCore.js file.
document.Form1.action = RefreshQueryString(document.Form1.action, UploadId);
// Cretate a new window that will be used to display a status information.
progressWindow = CreateProgressWindow("UploadStatusInfo.aspx", UploadId, 570, 280);
if (window.stop || window.document.execCommand)
{
document.Form1.Upload.style.visibility = "hidden";
document.getElementById("cancelButton").style.visibility = "visible";
}
document.Form1.submit();
}
// Terminates an upload process
function cancelUpload()
{
if (window.stop)
{
window.stop();
}
else
{
window.document.execCommand("Stop");
}
if (progressWindow != undefined)
{
progressWindow.close();
}
document.Form1.Upload.style.visibility = "visible";
document.getElementById("cancelButton").style.visibility = "hidden";
}
</script>
</HEAD>
<body>
<form id="Form1" method="post" runat="server" enctype="multipart/form-data">
This example demonstrates how to upload files to a web server and display a
status information of an upload process. A status information will be displayed
in the new window.
<br/>
<br/>
<table>
<tr>
<td>File 1:</td>
<td><input type="file" name="File_1" size="40"></td>
</tr>
<tr>
<td>File 2:</td>
<td><input type="file" name="File_2" size="40"></td>
</tr>
</table>
<br />
<input type="button" value="Upload" name="Upload" onclick="doUpload(); return false;">
<a id="cancelButton" onclick="cancelUpload()" style="VISIBILITY: hidden"><img src="images/cancel_button.gif" border="0"></a>
<br />
<br />
<asp:Label id="lblResponse" runat="server"></asp:Label>
</form>
<hr />
<a target="_blank" href="http://www.easyalgo.com/quickstart/util/srcview.aspx?path=/Examples/EAUpload/UploadWithProgressBar.src">View C Sharp source code</a>
<a target="_blank" href="http://www.easyalgo.com/quickstart/util/srcview.aspx?path=/Examples/EAUpload/VBNET/UploadWithProgressBar.src">View VB NET source code</a>
</body>
</HTML>