Ajax realizes the process of static refreshing the page with loading rotating pictures

Time:2021-10-16
Copy codeThe code is as follows:
<!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”>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<link href=”/Style/NiuLan.css” rel=”stylesheet” type=”text/css” />
<title></title>
< script type = “text / JavaScript” > / / when refreshing, the display data of the original page will not be hidden. This is a hidden function
//Get the pagerequestmanager object. The only such object in each asp.net ajax page is responsible for processing all async – postback requests
var prm = Sys.WebForms.PageRequestManager.getInstance(); // Add an event to handle the initializerequest event of pagerequestmanager. When async postback occurs, this event will be triggered and our initrequest function will be run
prm.add_initializeRequest(InitRequest);
//Add an event to handle the endrequest event of pagerequestmanager. When async postback is completed, this event will be triggered and our endrequest function will be run
prm.add_endRequest(EndRequest); function InitRequest(sender, args) {
//The updateprogress1 control is displayed
document.getElementById(‘detail’).style.display = “none”;
}
function EndRequest(sender, args) {
//Hide updateprogress1 control
document.getElementById(‘detail’).style.display = “block”;
}
//Used to cancel the async postback action
function CancelClick() {
//When in the async postback action, get_ The isinasyncpostback function will return true. At this time, calling the abortpostback function will cancel the async postback action.
if (prm.get_isInAsyncPostBack()) {
prm.abortPostBack();
}
}
</script>
</head>
<body >
<form runat=”server”>
//Using ScriptManager in Ajax extensions
<asp:ScriptManager runat=”server”>
</asp:ScriptManager>
//Place of use, such as
<asp:UpdatePanel ID=”UpdatePanel1″ runat=”server”>
<ContentTemplate>
//Release code
<div><asp:ImageButton ID=”ibtnFBSJ” runat=”server” ImageUrl=”/images/ershoufang/bs/fbsj.gif”
OnClick=”ibtnFBSJ_Click” />
</div>
//Updateprogress will be called when the page is refreshed statically, but the background also needs code. See below
<asp:UpdateProgress ID=”UpdateProgress1″ runat=”server” AssociatedUpdatePanelID=”UpdatePanel1″>
<ProgressTemplate>
<div style=”text-align: center”>
<img alt=”” src=”/images/loading.gif” />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
backstage
protected void ibtnFBSJ_Click(object sender, ImageClickEventArgs e)
{
System.Threading.Thread.Sleep(2000);
Drpsortorder. Selectedvalue = ((int) ershoufangjichuzufang. Order. Sort by publishing time). Tostring();
PopulateDetails();
}
//In this way, the page can be refreshed statically, with rotating pictures during loading. The user experience will be very good, and the effect is as follows

Ajax realizes the process of static refreshing the page with loading rotating pictures 
Of course, you can also use jQuery or Ajax to write dynamic loading table