最近看了看Asp.net Ajax,初级入门教程肯定就非Terrylee的Ajax入门系列了,虽说有些东西到正式版之后有所变化,不过照着学习一遍在不同的地方想办法用新的实现,还是一件比较有意思的事情啊。
现在就将遇到的一些问题和自己的一些想法记录下来,就当整理下思路了。
1、在后台注册异步的服务器端控件。通过ScriptManager的RegisterAsyncPostBackControl方法去将一个服务器端控件注册成一个异步触发器。可以在点击这个服务器端控件的时候不整页刷新。就像这个控件放在UpdatePanel中一样。
2、在UpdatePanel嵌套的时候可以2个UpdatePanel或者子UpdatePanel进行刷新。点击外面UpdatePanel中的按钮的时候,外层和里面嵌套的UpdatePanel都会刷新,点里面的子UpdatePanel的时候只会子UpdatePanel进行刷新,上层的UpdatePanel是不会刷新的。
3、一个页面中有多个UpdatePanel的时候,要想通过一个UpdatePanel中的事件去刷新另外一个UpdatePanel中数据。需要在一个UpdatePanel中去设置AsyncPostBackTrigger为另外一个UpdatePanel中的一个按钮。在按钮的事件处理函数中要对另外一个UpdatePanel的数据进行绑定,这样才能看到更新之后的效果。
4、关于UpdateProgress的使用。如果在不涉及脚本去控制UpdateProgress的显示与否的时候,有二种方式去将UpdateProgress与UpdatePanel进行关联。一就是将UpdateProgress放在UpdatePanel的ContentTemplate,这种情形下可以不用指定UpdateProgress的AssociatedUpdatePanelID属性,应该是默认的关联上了包含它在内的那个UpdatePanel。另一种是将UpdateProgress和UpdatePanel平级放置,这样的话为了不至于混淆,要指定UpdateProgress的AssociatedUpdatePanelID属性。不过为了养成好的习惯,最好在每个UpdateProgress中都指定AssociatedUpdatePanelID。
如果在UpdateProgress中放置了按钮,要通过脚本去控制是不是要取消异步操作的话,有几点注意事项。我刚开始自己写的时候没有注意,总是说Sys未定义的错误。后来发现是要将script脚本快放在ScriptManager声明之后就可以了。这个问题有好几个可能的原因,有的是未添加System.Web.Extensions的引用,有的是web.config中httphandle没有设置好,还有就是按照的ajax版本不对。总之,我的问题就是在把script快放到ScriptManager声明后面解决了的。
在用脚本控制是不是要取消异步操作的时候,我觉得有个很奇怪的现象,就是我只要写了那段代码,在当前那个UpdatePanel中点击那个激发异步操作的按钮会正常的出现UpdateProgress,点击取消也是可以正常实现的。但是要是我再加一个UpdatePanel,并且为这个UpdatePanel再指定另外一个UpdateProgress的时候,我在这个UpdatePanel中点击按钮激发异步操作的时候,不仅会出现这个UpdatePanel里面的UpdateProgress,之前用脚本控制的UpdateProgress也会显示出来,而且我在这个上面点“取消”去取消异步操作的话还有用。就是说这个时候它取代了我这个UpdatePanle中的UpdateProgress。会同时显示2个UpdateProgress出来,这点比较郁闷。不知道怎么解决啊,各位有知道的指点下啊。
var pp=Sys.WebForms.PageRequestManager.getInstance();
function CancelAsyncPostBack()
{if (pp.get_isInAsyncPostBack())
{pp.abortPostBack();}}pp.add_initializeRequest(InitializeRequest);pp.add_endRequest(EndRequest);var postBackElement;
function InitializeRequest(sender,args)
{if (pp.get_isInAsyncPostBack())
{args.set_cancel(true);
}postBackElement =args.get_postBackElement();if (postBackElement.id="Panel1Trigger"){$get("UpdateProgress1").style.display="block";}}function EndRequest(sender,args)
{if (postBackElement.id="Panel1Trigger"){$get("UpdateProgress1").style.display="none";}}5、关于异常处理的提示。用脚本去控制显示一个DIV出来,包含错误提示的,用来代替浏览器的alert。在我这边死活那个DIV就是弹不出来,就是不显示,害我郁闷了好一段时间。我把代码贴出来,大家帮我看看。
<%@ Page Language="C#" AutoEventWireup="true" Codebehind="WebForm8.aspx.cs" Inherits="AJAXEnabledWebApplication1.WebForm8" %>
<!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>使用ScriptManager控件</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">body {font-family: Tahoma;}#AlertDiv{left: 40%; top: 40%;position: absolute; 200px;padding: 12px;border: #000000 1px solid;background-color: white;text-align: left;visibility: hidden;z-index: 99;}#AlertButtons{position: absolute;right: 5%;bottom: 5%;}</style></head><body id="bodytag"><form id="form1" runat="server"><div><asp:ScriptManager ID="ScriptManager1" runat="server" OnAsyncPostBackError="ScriptManager1_AsyncPostBackError"></asp:ScriptManager><script language="javascript" type="text/javascript">
var DivElem= 'AlertDiv';var messageElem='AlertMessage';var errorMessageAdditional = 'Please try again.';var bodyTag='bodytag';Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);function ToggleAlertDiv(visString){
if (visString='hidden'){
$get(bodyTag).style.backgroundColor='white';}
else{
$get(bodyTag).style.backgroundColor='gray';}
var adiv=$get(DivElem);adiv.style.visibility=visString;
}
function ClearErrorState(){
$get(messageElem).innerHTML='';ToggleAlertDiv('hidden');}
function EndRequestHandler(sender,args){
if (args.get_error()!=undefined&&args.get_error().httpStatusCode=='500'){
var errormsg=args.get_error().message;args.set_errorHandled(true);ToggleAlertDiv('visible');
$get(messageElem).innerHTML='"'+errormsg+'"'+errorMessageAdditional;}
}
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"><ContentTemplate><asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel"><asp:Label ID="UpdatePanelMessage" runat="server"></asp:Label><br />last update:<%1: =DateTime.Now.ToString()
%>><br /><asp:Button ID="Button1" runat="server" Text="成功的异步" OnClick="SuccessProcessClick_Handler"OnClientClick="ClearErrorState()" /><br />死活那个DIV就是弹不出来啊。郁闷<br /><asp:Button ID="Button2" runat="server" Text="异步操作出错" OnClick="ErrorProcessClick_Handler"OnClientClick="ClearErrorState()" /></asp:Panel></ContentTemplate></asp:UpdatePanel><div id="AlertDiv"><div id="AlertMessage"></div><br /><div id="AlertButtons"><input id="OKButton" type="button" value="OK" runat="server" onclick="ClearErrorState()" /></div></div></div></form></body></html>后台代码主要就是下面三个方法了:
protected void SuccessProcessClick_Handler(object sender, EventArgs e){UpdatePanelMessage.Text = "异步回调成功完成.";
}protected void ErrorProcessClick_Handler(object sender, EventArgs e){throw new ArgumentException();}protected void ScriptManager1_AsyncPostBackError(object sender, AsyncPostBackErrorEventArgs e){ScriptManager1.AsyncPostBackErrorMessage = "异常信息为:" + e.Exception.Message;
}6、脚本调用WebService的情况。调用WebService的时候的脚本可以放在head快中,不需要放在ScriptManager声明之后了。注意一点就是在调用WebService的时候要将命名空间也带上。例如 AJAXEnabledWebApplication1.WebService1.HelloWorld();
在包含母板页的页面上面使用的话要在ContentPage中使用ScriptManagerProxy,而不是ScriptManager。这样在使用的时候就不会因为母板页的ScriptManager和ContentPage中的ScriptManagerProxy出现调用混淆的情况了。
还有几篇没有看完,等看完了接着再写。总体说来,微软还是为我们做了很多事情了,这个Asp.Net ajax的使用还是比较方便的,改天去试一下Ajax Control Toolkit中的那些控件试一下,看看会不会给我带来新的惊喜。