Pages

Monday, August 27, 2012

Upload Multipal Files with javascript in ASP.net C#

UploadFilesWithJavascript.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UploadFilesWithJavascript.aspx.cs" Inherits="UploadFilesWithJavascript" %>

<!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 runat="server">
    <title>Untitled Page</title>
     <script language="javascript" type="text/javascript">
    var counter = 0;
    var counter2 = 0;
    function AddFileUpload()
    {
         var div = document.createElement('DIV');
         div.innerHTML = '<input id="file' + counter + '" name = "file' + counter +

                         '" type="file" />' +

                         '<input  id="Button' + counter + '" type="button" ' +

                         'value="Remove" onclick = "RemoveFileUpload(this)" />';
         document.getElementById("FileUploadContainer").appendChild(div);
         counter++;
         counter2++;
         document.getElementById("btnAdd").style.visibility = "visible";        
    }
    function RemoveFileUpload(div)
    {     
         counter2--;       
         if(counter2 == 0)
            document.getElementById("btnAdd").style.visibility = "hidden";
         document.getElementById("FileUploadContainer").removeChild(div.parentNode);
    }    
    function DeleteConfirmation()
    {
        if(confirm('Are You Sure To Delete?'))       
            return true;       
        else       
            return false;       
    }
    </script>
</head>
<body>
    <form id="form1" runat="server" enctype="multipart/form-data" method = "post">
    <input id="Button1" type="button" class="inputButton" value="Add New File To Upload" onclick="AddFileUpload()" /><br />
    <div id="FileUploadContainer">
                                                                        <!--FileUpload Controls will be added here -->
                                                                    </div>
                                                                    <asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
    </form>
</body>
</html>


UploadFilesWithJavascript.aspx.cs

protected void btnUpload_Click(object sender, EventArgs e)
    {
        for (int i = 0; i < Request.Files.Count; i++)
        {
            HttpPostedFile PostedFile = Request.Files[i];
            if (getFileType(PostedFile.FileName) == "Image")
            {
                if (PostedFile.ContentLength > 0)
                {
                    string FileName = System.IO.Path.GetFileName(PostedFile.FileName).ToString();
                    int size = PostedFile.ContentLength;
                    PostedFile.SaveAs(Server.MapPath("Uploads\\") + FileName);
                }
            }
        }
    }
    string getFileType(string fileName)
    {
        string ext = Path.GetExtension(fileName);
        switch (ext.ToLower())
        {
            case ".gif":
                return "Image";
            case ".png":
                return "Image";
            case ".jpg":
                return "Image";
            case ".jpeg":
                return "Image";
            default:
                return "Not known";
        }
    }

No comments:

Post a Comment