Thursday, September 12, 2013

Asp.net FileUpload With ProgressBar

<%@ Page Language="C#" AutoEventWireup="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<script runat="server">
protected void UploadFile(object src, EventArgs e)
{
    if (myFile.HasFile)
    {
        string strFileName;
        int intFileNameLength;
        string strFileExtension;
        strFileName = myFile.FileName;
        intFileNameLength = strFileName.Length;
        strFileExtension = strFileName.Substring(intFileNameLength - 4, 4);        
        //if (strFileExtension == ".txt")
        {
            try
            {
                myFile.PostedFile.SaveAs(Server.MapPath(".") + "//Upload//" + strFileName + ".pdf"); //AJAXUpload.txt
                lblMsg.Text = strFileName + " Uploaded successfully!";
            }
            catch (Exception exc)
            {
                lblMsg.Text = exc.Message;
            }
        }
        //else
        //{
        //    lblMsg.Text = "Only Text File (.txt) can be uploaded.";
        //}
    }
    else
    {
        lblMsg.Text = "Please select a file!";
    }
}
</script>
<script language="javascript" type="text/javascript">
    function showWait() {
        if ($get('myFile').value.length > 0) {
            $get('UpdateProgress1').style.display = 'block';
        }
    }
</script>
    <title>File Upload</title>
</head>
<body>
<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"/>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <Triggers>
            <asp:PostBackTrigger ControlID="btnUpload" /> 
        </Triggers>
        <ContentTemplate>
            <asp:FileUpload ID="myFile" runat="server" />
            <asp:Label ID="lblMsg" runat="server"></asp:Label>            
            <br />
            <asp:Button ID="btnUpload" runat="server" Text="Upload" 
                OnClick="UploadFile" OnClientClick="javascript:showWait();"/>           
            <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
                <ProgressTemplate>
                    <asp:Label ID="lblWait" runat="server" BackColor="#507CD1" Font-Bold="True" ForeColor="White" Text="Please wait ... Uploading file"></asp:Label>
                </ProgressTemplate>
            </asp:UpdateProgress>
        </ContentTemplate>
    </asp:UpdatePanel>
</form>
</body>
</html>

Asp.net FileUpload ProgressBar

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FileUpload.aspx.cs" Inherits="FileUpload" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
    var size = 2;
    var id = 0;
    function ProgressBar() {
        if (document.getElementById('<%=FileUpload1.ClientID %>').value != "") {
            document.getElementById("divProgress").style.display = "block";
            document.getElementById("divUpload").style.display = "block";
            id = setInterval("progress()", 20);
            return true;
        }
        else {
            alert("Select a file to upload");
            return false;
        }
    }
    function progress() {
        //alert(id);
        size = size + 1;
        if (size > 299) {
            clearTimeout(id);
        }
        document.getElementById("divProgress").style.width = size + "pt";
        document.getElementById("<%=lblPercentage.ClientID %>").firstChild.data = parseInt(size / 3) + "%";
    }
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="SC1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="Up1" runat="server">
<Triggers>
<asp:PostBackTrigger ControlID="Button1" />
</Triggers>
<ContentTemplate>
<div style="text-align:left">
<asp:FileUpload ID="FileUpload1" runat="server" /> <br />
<br />
<asp:Button ID="Button1" runat="server" Text="Upload" OnClientClick="return ProgressBar()" OnClick="Button1_Click" /><br /><br />
<div id="divUpload" style="display:none">
<div style="width:300pt;;text-align:center;">Uploading...</div>
<div style="width:300pt;height:20px; border:solid 1pt gray">
<div id="divProgress" runat="server" style="width: 1pt; height: 20px; background-color:Gray;display:none">
</div>
</div>
<div style="width:300pt;;text-align:center;">
<asp:Label ID="lblPercentage" runat="server" Text="Label"></asp:Label></div>
</div>
</div>
<br />
<asp:Label ID="Label1" runat="server" ForeColor="Red" Text=""></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>


 



using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class FileUpload : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        // Do code here to saving a file from fileupload control
        //FileUpload1.PostedFile.SaveAs("path");
        if (FileUpload1.HasFile)
        {
            System.Threading.Thread.Sleep(8000);
            Label1.Text = "Upload successfull!";
        }
    }
}