Ajax AsyncFileUpload control using javascript in asp.net

In .aspx Page:


<script type="text/javascript">
        function UploadCompleted(sender, args) {
            var filename = document.getElementById('ctl00_ContentPlaceHolder1_Label1').innerHTML;
            var imgDisplay = $get("imgDisplay");
            $get("<%=divImagetag.ClientID %>").style.display = 'block';
            imgDisplay.src = "UploadedImages/" + filename;
            $get("<%=Label1.ClientID %>").innerHTML = "Successfully uploaded!!!";
            clearContents();
        }
        function UploadError(sender, args) {
            $get("<%=Label1.ClientID %>").innerHTML = "File upload failed.";
            clearContents();
            $get("<%=divImagetag.ClientID %>").style.display = 'none';
        }
        function clearContents() {
            var span = $get("<%=AsyncFileUpload1.ClientID%>");
            var txts = span.getElementsByTagName("input");
            for (var i = 0; i < txts.length; i++) {
                if (txts[i].type == "text") {
                    txts[i].value = "";
                }
            }
        }
     
    </script>


 <table border="0" cellpadding="5" cellspacing="5">
            <tr>
                <td colspan="2">
                    <asp:Label ID="lblMessage" runat="server" Font-Bold="true" ForeColor="Red"></asp:Label>
                </td>
            </tr>
            <tr>
                <td>
                    <strong>Image Upload </strong>
                </td>
                <td>
                    <ajaxToolkit:AsyncFileUpload ID="AsyncFileUpload1" runat="server" Width="400px" UploaderStyle="Modern"
                        CompleteBackColor="White" UploadingBackColor="#CCDDEE" ThrobberID="inProgress"
                        OnClientUploadError="UploadError" OnClientUploadComplete="UploadCompleted" OnUploadedFileError="AsyncFileUpload1_UploadedFileError"
                        OnUploadedComplete="AsyncFileUpload1_UploadedComplete" />
                    <asp:Image ID="inProgress" runat="server" ImageUrl="~/inProgress.gif" />
                    <br />
                    <asp:Label ID="Label1" runat="server"></asp:Label>
                </td>
            </tr>
        </table>
        <div id="divImagetag" runat="server" align="center" style="display: none">
            <img id="imgDisplay" alt="" src="" height="100px" width="150px" />
        </div>

In aspx.cs page:


  protected void AsyncFileUpload1_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
    {
        Random random = new Random();
        int randomNumber = random.Next(0, 100);
        if (AsyncFileUpload1.HasFile)
        {
            string fileextension = Path.GetExtension(e.FileName);
            if (fileextension == ".jpeg" || fileextension == ".gif" || fileextension == ".png" || fileextension == ".jpg" || fileextension == ".bmp")
            {
                string filename = randomNumber + fileextension;
                ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "sample", "top.$get(\"" + Label1.ClientID + "\").innerHTML = '" + filename + "';", true);
                string path = Server.MapPath(("~/UploadedImages/") + filename);
                AsyncFileUpload1.SaveAs(path);
            }
            else
            {
                lblMessage.Text = "We support only images of type jpg, gif,jpeg,bmp and png";
            }
        }
        else
        {
            lblMessage.Text = "Please Upload Image";
        }
    }
 protected void AsyncFileUpload1_UploadedFileError(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
    {
        lblMessage.Text = "Could not upload file!";
    }