UpdatePanel异步刷新要用到的几个控件:
1.ScriptManager
http://msdn.microsoft.com/zh-cn/library/system.web.ui.scriptmanager.aspx
2.UpdatePanel
http://msdn.microsoft.com/zh-cn/library/system.web.ui.updatepanel.aspx
3.UpdateProgress
http://msdn.microsoft.com/zh-cn/library/system.web.ui.updateprogress
使用以上几个控件实现异步刷新:
<form id="form1" runat="server">
<!--使用ScriptManger生成异步脚本-->
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<!--使用UpdateProgress显示异步刷新的等待效果-->
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="up3NetSort">
<ProgressTemplate>
<div class="cls_process">
<div class="cls_processing">
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<!--使用UpdatePanel执行异步刷新-->
<asp:UpdatePanel ID="up3NetSort" runat="server" UpdateMode="Always">
<!--UpdatePanel执行异步刷新的内容-->
<ContentTemplate>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" id="tbMain">
<tr>
<td height="30px">
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="height: 30px">
<tr>
<td background="images/tab_05.gif" style="width: 15%">
<img src="images/311.gif" width="16" height="16" />
</td> <td background="images/tab_05.gif" style="width: 75%"> <table border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="padding-left: 50px">
<div style="height: 20px; border: 1px solid #AACFE9; font-size: 12px; color: #294F76; padding-top: 3px; font-weight: normal">
地理维度:
<asp:RadioButtonList ID="PMTypeList" runat="server" AutoPostBack="True"
RepeatDirection="Horizontal" RepeatLayout="Flow"
OnSelectedIndexChanged="PMTypeList_SelectedIndexChanged"> <asp:ListItem Value="1" Selected="True">网格</asp:ListItem> <asp:ListItem Value="5">片区</asp:ListItem> <asp:ListItem Value="2">地市</asp:ListItem> </asp:RadioButtonList>
指标类型:
<asp:RadioButtonList ID="IndicatorsList" runat="server" AutoPostBack="True"
RepeatDirection="Horizontal" RepeatLayout="Flow"
OnSelectedIndexChanged="IndicatorsList_SelectedIndexChanged"> </asp:RadioButtonList>
</div>
</tr>
</table>
</td>
<td background="images/tab_05.gif">
</td>
<td width="14">
<img src="images/tab_07.gif" width="14" height="30" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</form>
解决异步刷新后js失效的2种方法:
1.后台重新注册JS方法
ScriptManager.RegisterStartupScript(Page, typeof(string), "Sort", "Fun_Sort();", true);
Fun_Sort()为要前台重新注册的js方法。
2.使用Sys.WebForms.PageRequestManager 类重新注册方法
Sys.WebForms.PageRequestManager 类的地址:http://msdn.microsoft.com/zh-cn/library/bb311028.aspx
前台使用Sys.WebForms.PageRequestManager 类:
function EndRequestHandler()
{
//刷新之后要运行的js
}
function reload()
{
//异步刷新后要执行的动作 Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
}
//在jquery的ready()中注册方法$(document).ready(
function()
{
reload();
}
)