asp.net javascript file No refresh upload instance code 1th/2 Page _ Practical Tips

Source: Internet
Author: User

In the new data items, the use of Ajax to achieve no refresh submission, but when uploading files, due to data type reasons, can not be the page of the <asp:FileUpload> in a string value of the way to call JS. I found a total of two methods to be resolved, to achieve no refresh upload.
The first method: the use of JS ADODB.stream, the file first converted into a stream, and then through JS upload to the server, so that there is an advantage is that you can upload oversized files, and as a result of data flow, can support the continuation of breakpoints, convenient display upload progress and other human functions. The only downside is that the client browser needs to set the security level, or install the associated ActiveX control (the control itself, loaded into the page).
Related code:
File has: A front page: upload.html, 1 js control: upload.js, a background processing page: accept.aspx (Accept.aspx.cs)
The code files are as follows:
Upload.html

Copy Code code as follows:

<title> Untitled Page </title>
<script src= "Upload.js" src= "upload.js" language= "JScript" type= "Text/jscript" ></script>
<body>
<form id= "Form1" runat= "Server" >
<div style= "width:100%" >
<input type= "File" id= "Hidfilepath"/>
<input type= "button" id= "OK" onclick= "Beginuploadfile (' 0 ', true)" title= "Upload" value= "UpLoad"/>
</div>
<div id= "Lblleavingstime" >TIME</div>
<div id= "Returninfo" >Info</div>
</form>
</body>

Upload.js
Copy Code code as follows:

var g_xmlhttp = null;
var g_stream = new ActiveXObject (' ADODB. Stream ');
var g_sendcount = 0;
var g_totalcount = 0;
var g_filesize = 0;
var g_upfiletype = 0;
var g_blocksize = 1024 * 100; Each segment is divided into 100K
var fileextname = ""; File suffix name
var g_pauseflag = false;
var g_begintime = null;
var g_guageflag = false;
var nfilename = "";
function Init ()
{
Inittitleevent ();
Beginuploadfile ();
}
function Moveguage ()
{
var t_time = new Date ();
var t_oddtime = Math.ceil (T_time.gettime ()-g_begintime.gettime ())/G_sendcount * (G_totalcount-g_sendcount)/1000);
var t_oddtimestring = ';
if (t_oddtime >= 3600)
{
t_oddtimestring = Math.floor (t_oddtime/3600) + ' when ';
T_oddtime%= 3600;
}
if (t_oddtime >= 60)
{
T_oddtimestring + = Math.floor (t_oddtime/60) + ' min ';
T_oddtime%= 60;
}
Document.all.lblLeavingsTime.innerText = t_oddtimestring + t_oddtime + ' sec ';
}
The 1th parameter represents the type of upload and provides a reference for naming a new file
The 2nd parameter indicates if you want to display a status bar
function Beginuploadfile (Upfiletype, Guageflag)
{
if (G_stream = null)
{Alert ("Your machine does not support ADODB.stream.");}
Else
{
G_guageflag = Guageflag;
G_upfiletype = Upfiletype;
G_stream.type = 1;
G_stream.open ();
var pth = document.getElementById ("Hidfilepath"). Value;
G_stream.loadfromfile (PTH);
var fname=pth.split (' \ \ ');
Nfilename = Fname[fname.length-1];
Fileextname = Nfilename.split ('. ') [1].tolowercase ();
g_stream.position = 0;
G_sendcount = 1;
G_filesize = g_stream.size;
if (upfiletype = 0)//upload picture
{
if (G_filesize > 1024 * 1024 * 2)//cannot be greater than 2M
{
Document.all.returnInfo.innerText = "File size exceeds 2m! " ;
G_pauseflag = true;
return;
}
var str = "Bmp,jpg,jpeg,gif,png,icon";
if (Str.search (fileextname) = =-1)//Picture format cannot be out of range
{
Document.all.returnInfo.innerText = "file format is not correct, please select BMP, JPG, JPEG, GIF, PNG, icon format picture!" " ;
G_pauseflag = true;
return;
}
}
G_totalcount = Math.ceil (g_stream.size/g_blocksize);
G_begintime = new Date ();
SendData ();
}
}
function SendData ()
{
if (G_pauseflag)
{
Return
}
if (G_sendcount <= g_totalcount)
{
var t_xmldom = null;
var t_root = null;
var t_node = null;
var t_attribute = null;
T_xmldom = new ActiveXObject (' Microsoft.XMLDOM ');
T_xmldom.async = false;
T_xmldom.resolveexternals = false;
T_node = t_xmldom.createprocessinginstruction (' xml ', ' version= ' 1.0 ");
T_xmldom.appendchild (T_node);
T_root = t_xmldom.createelement (' Root ');
T_xmldom.appendchild (T_root);
T_XMLDOM.documentElement.setAttribute (' Xmlns:dt ', ' urn:schemas-microsoft-com:datatypes ');
T_node = t_xmldom.createelement (' Data ');
T_node.datatype = ' bin.base64 ';
T_node.nodetypedvalue = G_stream.read (g_blocksize);
T_attribute = T_xmldom.createattribute (' Upfiletype ');
T_attribute.value = G_upfiletype;
T_node.setattributenode (T_attribute);
T_attribute = T_xmldom.createattribute (' FileIndex ');
T_attribute.value = G_sendcount;
T_node.setattributenode (T_attribute);
T_attribute = T_xmldom.createattribute (' TotalCount ');
T_attribute.value = G_totalcount;
T_node.setattributenode (T_attribute);
T_attribute = T_xmldom.createattribute (' filesize ');
T_attribute.value = g_filesize;
T_node.setattributenode (T_attribute);
T_attribute = T_xmldom.createattribute (' blocksize ');
T_attribute.value = g_blocksize;
T_node.setattributenode (T_attribute);
T_attribute = T_xmldom.createattribute (' Fileextname ');
T_attribute.value = Fileextname;
T_node.setattributenode (T_attribute);
T_root.appendchild (T_node);
G_xmlhttp = new ActiveXObject (' microsoft.xmlhttp ');
G_xmlhttp.open (' POST ', ' acceptfile.aspx ', true);
G_xmlhttp.onreadystatechange = Xmlhttpstatechange;
G_xmlhttp.send (T_xmldom);
if (G_guageflag) {moveguage ();}
}
Else
{
var xx = Spider. BookFile.FileObj.getFileName ();
alert (Xx.value);
Document.all.lblLeavingsTime.innerText = ' 0 seconds ';
CloseWindow (Document.all.cmdClose);
Document.all.returnInfo.innerText = ' File upload complete! ';
}
}
function Xmlhttpstatechange ()
{
if (g_xmlhttp.readystate = 4)
{
var rstr = G_xmlhttp.responsetext;
if (rstr = = ' OK ')
{
g_sendcount++;
SendData ();
}
Else
{
Document.all.returnInfo.innerText = RSTR;
CloseWindow (Document.all.cmdClose);
}
}
}
function CloseWindow (p_obj)
{
G_pauseflag = true;
G_stream.close ();
}

accept.aspx
Copy Code code as follows:

<%@ Page language= "C #" autoeventwireup= "true" codefile= "AcceptFile.aspx.cs" inherits= "Commonjs_acceptfile"%>

Accept.aspx.cs
Copy Code code as follows:

Using System;
Using System.Data;
Using System.Configuration;
Using System.Collections;
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;
Using System.Xml;
Using System.IO;
Using Spider. Bookfile; This is the file class you wrote.
public partial class CommonJS_AcceptFile:System.Web.UI.Page
{
protected void Page_Load (object sender, EventArgs e)
{
AjaxPro.Utility.RegisterTypeForAjax (typeof (Fileobj));
XmlDocument t_xmldocument = new XmlDocument ();
T_xmldocument.load (this. Request.inputstream);
XmlNode T_xmlnode = T_xmldocument.selectsinglenode ("Root/data");
Fileobj t_fileobj = new Fileobj ();
String t_upfiletype = t_xmlnode.attributes["Upfiletype"]. Value;
String t_fileindex = t_xmlnode.attributes["FileIndex"]. Value;
String t_totalcount = t_xmlnode.attributes["TotalCount"]. Value;
String t_filesize = t_xmlnode.attributes["FileSize"]. Value;
String t_blocksize = t_xmlnode.attributes["BlockSize"]. Value;
String t_fileextname = t_xmlnode.attributes["Fileextname"]. Value;
byte[] T_file = convert.frombase64string (T_XmlNode.FirstChild.Value);
Fileobj.upfile myupfile = new Fileobj.upfile ();
Myupfile.filecount = T_totalcount;
Myupfile.fileindex = T_fileindex;
Myupfile.upfiletype = T_upfiletype;
Myupfile.filesize = t_filesize;
Myupfile.blocksize = t_blocksize;
Myupfile.extname = T_fileextname;
Myupfile.t_file = T_file;
Fileobj.insertfilelist (Myupfile);
if (fileobj.geterrmsg = "")
{
This. Response.Write ("OK");
}
Else
{
This. Response.Write (FILEOBJ.GETERRMSG);
}
}
}

Current 1/2 page 12 Next read the full text
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.