Ajax调用后台方法的几种写法（三）UpdatePanel
发布时间：2020-12-15 21:06:30 所属栏目：百科 来源：网络整理
导读：现在将微软的Ajax框架，也就说UpdatePanel，ScriptManager，Progress这些控件。这些功能感觉比前面几种稍微强大点。 页面代码： asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true" AsyncPostBackErrorMessage="操作失
|
现在将微软的Ajax框架，也就说UpdatePanel，ScriptManager，Progress这些控件。这些功能感觉比前面几种稍微强大点。 页面代码： <asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"
AsyncPostBackErrorMessage="操作失败。系统出现错误，请与系统技术人员联系！">
</asp:ScriptManager>
<asp:UpdatePanel ID = "updateAction" runat="server" ChildrenAsTriggers="False"
UpdateMode="Conditional">
<ContentTemplate>
<table class="tableMain1" align="center">
<tr>
<td>
<table class="tableQuery2">
<tr>
<td>
<table class="tableMain1" cellspacing="0" cellpadding="0">
<tr>
<td class="tdTips">
成交报告编号
</td>
<td class="tdInput">
<asp:TextBox ID="txtReportNo" CssClass="textfield1" runat="server"></asp:TextBox>
</td>
<td class="tdTips">
成交日期
</td>
<td class="tdInput">
<asp:TextBox ID="txtContractDateMin" Width="50px" CssClass="textfield1" runat="server"></asp:TextBox>
<AjaxToolKit:CalendarExtender ID="txtContractDateMin_CalendarExtender" Format="yyyyMMdd"
runat="server" Enabled="True" TargetControlID="txtContractDateMin">
</AjaxToolKit:CalendarExtender>
-
<asp:TextBox ID="txtContractDateMax" Width="50px" CssClass="textfield1" runat="server"></asp:TextBox>
<AjaxToolKit:CalendarExtender ID="txtContractDateMax_CalendarExtender" Format="yyyyMMdd"
runat="server" Enabled="True" TargetControlID="txtContractDateMax">
</AjaxToolKit:CalendarExtender>
</td>
</tr>
<tr>
<td colspan="4" align="right" >
<asp:Button ID="btnSearch" CssClass="submit1" runat="server" Text="查 询"
onclick="btnSearch_Click"></asp:Button> <asp:Button
ID="btnClear" CssClass="submit1" runat="server" Text="重 置"
onclick="btnClear_Click"></asp:Button> <asp:Button
ID="btnExportToExcel" CssClass="submit1" runat="server" Text="导 出"
onclick="btnExportToExcel_Click"></asp:Button>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center"> //这是一个封装的DataGrid，与GridView类似
<aspex:DataGridEx ID="dgList" runat="server" SortType="ASC" SortName="ContractDate"
AutoGenerateColumns="false" onitemdatabound="dgList_ItemDataBound"
>
<PagerStyle Mode="NumericPages"></PagerStyle>
<Columns>
<asp:BoundColumn Visible="False" DataField="ContractID"></asp:BoundColumn>
<asp:BoundColumn DataField="ReportNo" SortExpression="ReportNo" HeaderText="成交编号">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="ContractDate" SortExpression="ContractDate" HeaderText="成交日期" DataFormatString="{0:yyyy-MM-dd}">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="PropertyName" SortExpression="PropertyName" HeaderText="物业名称">
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="ReportDate" SortExpression="ReportDate" HeaderText="上业绩日期" DataFormatString="{0:yyyy-MM-dd}">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="Trade" SortExpression="Trade" HeaderText="交易类型">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="Price" SortExpression="Price" HeaderText="成交金额" DataFormatString="{0:N}">
<ItemStyle HorizontalAlign="Right"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="TotalCommission" SortExpression="TotalCommission" HeaderText="总佣金">
<ItemStyle HorizontalAlign="Right"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="TotalExternalCommission" SortExpression="TotalExternalCommission" HeaderText="奖励总金额"
DataFormatString="{0:N}">
<ItemStyle HorizontalAlign="Right"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="CooperateFeeType" HeaderText="合作关系">
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="DeptName" HeaderText="分行(组别)">
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="CooperateName" HeaderText="姓名">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="CommRatePer" SortExpression="CommRatePer" HeaderText="奖励金额"
DataFormatString="{0:N}">
<ItemStyle HorizontalAlign="Right"></ItemStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="Remark" HeaderText="备注" ItemStyle-CssClass="tdWrap">
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundColumn>
</Columns>
</aspex:DataGridEx>
</td>
</tr>
</table>
</ContentTemplate>
<Triggers> 指定哪些事件会触发
<asp:AsyncPostBackTrigger ControlID="btnSearch" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="btnClear" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="dgList" EventName="ItemDataBound" />
<asp:PostBackTrigger ControlID="btnExportToExcel" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server"
AssociatedUpdatePanelID="updateAction"> //进度
<ProgressTemplate>
<uc1:Progress ID="Progress1" runat="server" /> //用了一个自己写的控件，此处可以设置在后台查询等待时页面的等待遮罩效果
</ProgressTemplate>
</asp:UpdateProgress>后台代码： 只贴btnSearch的Click事件的代码
protected void btnSearch_Click(object sender,EventArgs e)
{
this.LoadData();
}
protected void LoadData()
{
try
{
string sql = " Select * From VW_CT_AwardRentContractReport Where 1=1 ";
if (txtReportNo.Text.Trim() != "")
{
sql += string.Format(@" And ReportNo Like '{0}%' ",txtReportNo.Text.Trim());
}
if (txtContractDateMin.Text.Trim() != "")
{
sql += string.Format(@" And ContractDate >= '{0}'",txtContractDateMin.Text.Trim());
}
if (txtContractDateMax.Text.Trim() != "")
{
sql += string.Format(@" And ContractDate <= '{0}'",txtContractDateMax.Text.Trim() + " 23:59:59");
}
sql += " order by ContractDate";
this.dgList.DataSourceSQL = sql;
this.dgList.BindData();
}
catch (Exception ex)
{
CentaUtil.SendExceptionMessage(this.Page,ex);
throw ex;
}
}
局限性：页面上都得加ScriptManager，UpdatePanel，需要变换的控件都得放到UpdatePanel中，还得写Trigger。前台写的稍微复杂点，但是后台代码很简单，跟没用Ajax的代码一样的。
其实本人的目的是想试验一个这样的功能，前台的按钮在后台事件中能给其他服务器控件赋值，特别是GridView绑定数据这种，但是由于数据量多，这个过程会比较慢，又想在前台加一个等待的遮罩提示，直到数据完全绑定到GridView上，遮罩层才消失。这就必须用Ajax。
目前用的就是UpdatePanel的这种方式，但是想尝试其他的方式，经尝试，发现还是这种最好了。因为我想系统所有的页面在后台查询时，前台都遮罩，目前还只有这种罪方便了。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |