您的位置:首页 > 其它

Ajax调用后台方法的几种写法(三)UpdatePanel

2012-12-13 16:01 375 查看
现在将微软的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的这种方式,但是想尝试其他的方式,经尝试,发现还是这种最好了。因为我想系统所有的页面在后台查询时,前台都遮罩,目前还只有这种罪方便了。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: