您的位置:首页 > 编程语言 > ASP

ASP.NET AJAX 学习笔记

2009-08-14 12:50 633 查看
最近看了看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; width: 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中的那些控件试一下,看看会不会给我带来新的惊喜。

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: