The Asp.net load progress bar and work page framework are mainly composed of four parts. The names of these four parts and their roles in the framework are as follows:
1. Entry link address page (aspx): for example, the login page provides a link to the target address and transmits some basic link parameters required for startup to the target.
2. link to the target page (aspx): the target object is the core of the entire framework. write outputs two IFRAME values. One of the iframe1 values is contained in a DIV, which points to the loading progress image page. SRC of another iframe2 is set to null (the background code sets SRC to point to the actual target work page later). After two iframe html codes are output, immediately output the request through the XMLHTTP request, and assign the value returned by the request to the src attribute of iframe2.
During page loading, the background Code places the passed basic link parameters in the cache for backup.
When receiving the XMLHTTP request from the front-end code, the background Code includes the basic link parameters in the cache, together with the actual target work page address, return to the XMLHTTP requestor in the form of a URL (that is, the front-end HTML code)
3. Loading progress page (HTML): displays a loading progress bar, which is called in the onload event. When the progress bar is full, the display of the progress bar is closed.
4. Actual Target work page (aspx): After the page is loaded, the window. Parent index is used to go to the target page of the entry link, closing the display of the DIV containing iframe1.
The basic Link parameter required for receiving and starting the background code. The basic Link parameter is provided by the SRC of iframe2 on the target page of the portal link.
Framework implementation code:
1. Entry link address page (aspx ):
CS:
System. Collections. Specialized. namevaluecollection parameters = new system. Collections. Specialized. namevaluecollection ();
Parameters. Add ("examid", gvactorlist. datakeys [E. Row. rowindex]. value. tostring ());
Parameters. Add ("paperid", (displayobject_v_biz_query_exam_actor) E. Row. dataitem). actor_paper_id );
// String url = controlhelper. encodeurl ("modules/exam/exam_action.aspx", parameters );
String url = controlhelper. encodeurl ("modules/exam/loading. aspx", parameters );
String scripts = geopenfullwindowscript (URL );
E. row. cells [0]. TEXT = string. concat ("<a href =/" javascript: ", scripts,"/">", E. row. cells [0]. text, "</a> ");
2. Link to the target page (aspx ):
HTML:
<! 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> </title>
<SCRIPT type = "text/JavaScript">
Function outputloading ()
{
Document. Write ('<HTML> ');
Document. Write ('<body> ');
Document. Write ('<SCRIPT type =/'text/JavaScript/'> ');
Document. Write ('function createrequest ()');
Document. Write ('{');
Document. Write ('var XMLHTTP = false ;');
Document. Write ('/* @ cc_on @*/');
Document. Write ('/* @ if (@ _ jscript_version> = 5 )');
Document. Write ('try {');
Document. Write ('xmlhttp = new activexobject ("msxml2.xmlhttp ");');
Document. Write ('} catch (e ){');
Document. Write ('try {');
Document. Write ('xmlhttp = new activexobject ("Microsoft. XMLHTTP ");');
Document. Write ('} catch (E2 ){');
Document. Write ('xmlhttp = false ;');
Document. Write ('}');
Document. Write ('}');
Document. Write ('@ end @*/');
Document. Write ('If (! XMLHTTP & typeof XMLHttpRequest! =/'Undefined /'){');
Document. Write ('xmlhttp = new XMLHttpRequest ();');
Document. Write ('}');
Document. Write ('Return XMLHTTP ;');
Document. Write ('}');
Document. Write ('function request (URL )');
Document. Write ('{');
Document. Write ('var request = createrequest ();');
Document. Write ('request. Open ("get", URL, false );');
Document. Write ('request. Send ();');
Document. Write ('If (request. status! = 200 )');
Document. Write ('{');
Document. Write ('Return/'request failed /';');
Document. Write ('}');
Document. Write ('else ');
Document. Write ('{');
Document. Write ('Return request. responsetext ;');
Document. Write ('}');
Document. Write ('}');
Document. Write ('</SCRIPT> ');
VaR content = '<IFRAME id =/'frameloading/'marginwidth = 0 marginheight = 0 frameborder = 0 bordercolor =/' #000000/'scrolling = No src =/'loading.htm/'width = 250 Height = 70> <// IFRAME> ';
VaR left = 200;
VaR Top = 150;
Document. write ('<Div id = "loadingpanel" display: block; style = "Z-INDEX: 10; position: absolute; width: 250px; Height: 70px; left: '+ Left +'; top: '+ TOP +' "> '+ content +' </div> ');
Document. write ('<IFRAME id =/' frametarget/'marginwidth = 0 marginheight = 0 frameborder = 0 bordercolor =/' #000000/'scrolling = No src =/'/'width = 100% Height = 100%> <// IFRAME> ');
Document. Write ('<SCRIPT type =/'text/JavaScript/'> ');
Document. Write ('var url =/'loading. aspx? Target = true /';');
Document. Write ('var frame = Document. getelementbyid (/'frametarget /');');
Document. Write ('frame. src = request (URL );');
Document. Write ('</SCRIPT> ');
Document. Write ('<SCRIPT type =/'text/JavaScript/'> ');
Document. Write ('function closemsgchain ()');
Document. Write ('{try {window. opener. Location. Reload (); self. Close ();} catch (e ){}}');
Document. Write ('</SCRIPT> ');
Document. Write ('</body> ');
Document. Write ('
}
</SCRIPT>
</Head>
<Body onload = "outputloading ()">
<Form ID = "form1" runat = "server">
<Div>
</Div>
</Form>
</Body>
</Html>
CS:
Protected void page_load (Object sender, eventargs E)
{
If (request ["target"]! = NULL)
{
// Return the cached parameters to the client
String examid = (string) cachehelper. getservercache (cachehelper. preparecachekey ("loading_examid", systemlogic. currentuser. ID ));
String paperid = (string) cachehelper. getservercache (cachehelper. preparecachekey ("loading_paperid", systemlogic. currentuser. ID ));
System. Collections. Specialized. namevaluecollection parameters = new system. Collections. Specialized. namevaluecollection ();
Parameters. Add ("examid", examid );
Parameters. Add ("paperid", paperid );
String url = controlhelper. encodeurl ("exam_action.aspx", parameters );
Response. Write (URL );
Response. End ();
}
Else if (! Page. ispostback)
{
System. Collections. Specialized. namevaluecollection parameters = controlhelper. decodeparameter (this. request );
If (parameters ["examid"]! = NULL)
{
// Insert the passed parameters into the cache
Cachehelper. setservercache (cachehelper. preparecachekey ("loading_examid", systemlogic. currentuser. ID), parameters ["examid"]);
Cachehelper. setservercache (cachehelper. preparecachekey ("loading_paperid", systemlogic. currentuser. ID), parameters ["paperid"]);
}
}
}
3. Loading progress image page (HTML ):
HTML:
<! 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>
<Title> </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Style type = "text/CSS">
Body, HTML {margin: 0; padding: 20px; font-size: 12px; font-family: Arial; Font: 12px/1 tahoma, Arial ;}
. Stepout {Height: 20px; Border: 1px solid # b5d6e6; Background: white; width: 200px; overflow: hidden; display: none ;}
. Stepin {width: 50px; Background: red; border-top: 1px solid b5d6e6; border-bottom: 1px solid b5d6e6; overflow: hidden; color: # b5d6e6; text-align: center; Font: 12px/1.6 Arial ;}
</Style>
<SCRIPT type = "text/JavaScript">
// <! [CDATA [
Function loadbar (outer, iner, time ){
$ = Function (x) {return typeof x = "string "? Document. getelementbyid (x): x };
Outer = $ (outer );
Iner = $ (INER );
VaR I, width, this = This, S = (Time || 2000)/10;
This. Run = function (){
Cleartimeout (this. t );
Outer. style. Display = 'block ';
Width = outer. offsetwidth;
I = 0;
(Function (){
Iner. style. width = width/S * I ++;
Iner. innerhtml = math. Ceil (INER. offsetwidth/width * 100) + '% ';
If (I <s) {This. t = setTimeout (arguments. callee, 10)
} Else
{
// After loading is completed, hide the progress bar
Optional bytes parent.doc ument. getelementbyid ('loadingpanel '). style. Display = 'none ';
}
})()
}
};
Function showloading ()
{
// 10-second progress bar
VaR LDH = new loadbar (stepout, stepin, 10000 );
LDH. Run ();
}
//]>
</SCRIPT>
</Head>
<Body onload = "showloading ()">
<Span> loading data. Please wait... </span>
<Div class = "stepout" id = "stepout">
<Div class = "stepin" id = "stepin"/>
</Div>
</Body>
</Html>
4. Actual Target work page (aspx ):
HTML:
<HTML>
<Body topmargin = "0" leftmargin = "0">
<SCRIPT type = "text/JavaScript">
// After loading is completed, hide the progress bar
Optional bytes parent.doc ument. getelementbyid ('loadingpanel '). style. Display = 'none ';
</SCRIPT>
</Body>
</Html>
CS:
System. Collections. Specialized. namevaluecollection parameters = controlhelper. decodeparameter (this. request );
If (parameters ["examid"]! = NULL)
{
This. userinfo. userid = systemlogic. currentuser. ID;
This. examinfo. examid = parameters ["examid"];
This. paperinfo. examid = parameters ["examid"];
This. paperinfo. paperid = parameters ["paperid"];
}
Framework running effect: