AJAX.NET的UpdatePanel应用(2)
来源:互联网 发布:微信mac下载 编辑:程序博客网 时间:2024/05/29 11:12
ASP.NET 2.0脚本支持
–不推荐,或者说不要使用Response.Write方法
不止是破坏了整个页面模型,特别是开发控件
–使用Framework所支持的方法
RegisterArrayDeclaration
RegisterClientScriptBlock
RegisterClientScriptInclude
RegisterClientScriptResource
RegisterExpandoAttribute
RegisterHiddenField
RegisterOnSubmitStatement
RegisterStartupScript
ClientScriptManager cs = this.ClientScript;
//创建JavaScript数组
//<script type="text/javascript">
//<!--
//var Hello = new Array(1, 2, 3);
//// -->
//</script>
//但当Array(5)的时候是表示长度为5的数组
cs.RegisterArrayDeclaration("Hello", "1", "2", "3");
//为对象输出一个函数,为true时自动加上<script></script>
// <script type="text/javascript">
//<!--
//function helloWorld(){alert(1);}// -->
//</script>
cs.RegisterClientScriptBlock(this, GetType(), "HelloWorld", "function helloWorld(){alert(1);}",true);
//添加对JS脚本的引用
//<script src="HelloWorld.js" type="text/javascript"></script>
cs.RegisterClientScriptInclude("HelloWorld","HelloWorld.js");
//为指定控件添加额外的属性,一定要为ClientID,因为生成的在客户端表示不一样
//<script type="text/javascript">
//<!--
//var Button1 = document.all ? document.all["Button1"] : document.getElementById("Button1");
//Button1.Hello = "World";
//// -->
//</script>
cs.RegisterExpandoAttribute(this.Button1.ClientID,"Hellod","World");
//添加个隐藏值
//<input type="hidden" name="hello" id="hello" value="world" />
cs.RegisterHiddenField("Hello","World");
//confirm
//<script type="text/javascript">
//<!--
//function WebForm_OnSubmit() {
//return window.confirm('Do you really want to submit the form?');
//return true;
//}
//// -->
//</script>
cs.RegisterOnSubmitStatement(this.GetType(), "HelloWorld", "return window.confirm('Do you really want to submit the form?')");
//添加一个Script,最开始运行
//<script>alert('The page has loaded!')</script>
cs.RegisterStartupScript(this.GetType(), "HelloWorld", "<script>alert('The page has loaded!')</script>");
•在异步更新的环境中注册脚本,所以当使用Response.Write();就会报错了
–使用ScriptManager对应的静态方法
–新方法与原有方法的区别:
•方法都会都接受一个参数
•并非所有注册过的脚本都会生效
•RegisterExpandoAttribute方法多了个encode参数
–新方法可以用来完全替换原有方法
•在非异步回送环境中会使用ClientScriptManager的对应方法进行注册
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<%= DateTime.Now %>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click1" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode=Conditional>
<ContentTemplate>
<%= DateTime.Now %>
</ContentTemplate>
</asp:UpdatePanel>
protected void Button1_Click1(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this.UpdatePanel1, this.GetType(), "UpdatePanel1", "alert(1)", true);
ScriptManager.RegisterStartupScript(this.UpdatePanel2, this.GetType(), "UpdatePanel2", "alert(2)", true);
}
结果,当点击Button的时候,只刷新了UpdatePanel1.只有当UpdatePanel2的UpdateMode为Always或不写时才会更新
另,ScriptManager.RegisterStartupScript();也可以直接对整个PAGE操作了
l 错误处理
服务器端ScriptManager设置
–AllowCustomErrorsRedirect属性:遇到错误是否自动根据web.config中的设置跳转,默认值为True。
–AsyncPostBackError事件:异步刷新中出现错误时触发的事件。
–AsyncPostBackErrorMessage属性:客户端接受到的错误信息。
Web.Config中<customErrors mode="On" defaultRedirect="~/Error.aspx"></customErrors>
Error.aspx为自定义错误
页面中
<asp:ScriptManager ID="ScriptManager1" runat="server" AllowCustomErrorsRedirect="true">
</asp:ScriptManager>
<asp:ScriptManager ID="ScriptManager1" runat="server" AllowCustomErrorsRedirect="false"
当服务端抛出个异常的时候,会跳出一段XXXXXX的错误
添加如下事件
<asp:ScriptManager ID="ScriptManager1" runat="server" AllowCustomErrorsRedirect="false"
OnAsyncPostBackError="ScriptManager1_AsyncPostBackError"> </asp:ScriptManager>
protected void ScriptManager1_AsyncPostBackError(object sender, AsyncPostBackErrorEventArgs e)
{
ScriptManager.GetCurrent(this).AsyncPostBackErrorMessage = e.Exception.Message;
}
但这样的话会弹出一个对话框
比如在页面中添加如下
<div id="error"></div>
<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, e)
{
e.set_errorHandled(true);
$get("error").innerHTML = "Sorry, an error has occurred: " + e.get_error().message;
setTimeout(function(){ $get("error").innerHTML = ""; }, 3000);
});
</script>
客户端编程
–响应PageRequestManager的endRequest事件。
–将errorHandled属性设为true。
l 动态操作
要点:
–在生命周期的Load阶段结束之前动态添加控件
–为每个动态控件指定明确的ID
–不要为页面中的UpdatePanel添加新的Trigger
原因
–使用ContentTemplateContainer属性向UpdatePanel内添加新控件
protected void Page_Load(object sender, EventArgs e)
{
UpdatePanel up = new UpdatePanel();
up.ID = "UpdatePanel1";
this.Form.Controls.Add(up);
LiteralControl lc = new LiteralControl(DateTime.Now.ToString());
up.ContentTemplateContainer.Controls.Add(lc);
Button btn = new Button();
btn.Text = "Refresh";
up.ContentTemplateContainer.Controls.Add(btn);
}
实现分析与源代码下载:http://www.cnblogs.com/JeffreyZhao/archive/2007/03/29/SwitchPartManager.html
演示:http://www.jeffzon.net/Samples/SwitchPartManager/Default.aspx
l 实现原理简要分析
传统的PostBack
Init
Process PostBack
PostBack Events
Save State
ProRender
Render
Upload
异步PostBack
- PageRequestManager -- ProRender
ProRender
Upload
请求内容数据大小没有任何减少
–采集Form中所有<input />并发送
–包含ViewState
尽可能减少客户端接受到的数据大小
–使用多个UpdatePanel包含多个部分
–UpdateMode尽量不要设为Always
什么样的UpdatePanel会更新?
–UpdateMode为Always
–AsyncPostBackTrigger的条件被满足
–Update方法被调用
–客户端告诉服务器端需要更新
ChildrenAsTriggers属性的效果体现在客户端
通过元素的ID、UniqueID与DOM结构共同判断
具体参照原文PPT
l 相关资源
官方站点:
– http://ajax.asp.net
ScottGuthrie的blog:
– http://weblogs.asp.net/scottgu/
WebCast AJAX作者视频blog:( 本系列视频都是参考此BLOG)
– http://jeffreyzhao.cnblogs.com
•MSDN中文网站http://www.microsoft.com/china/msdn
•MSDN中文网络广播http://www.msdnwebcast.com.cn
•MSDN Flash http://www.microsoft.com/china/newsletter/case/msdn.aspx
•MSDN开发中心 http://www.microsoft.com/china/msdn/DeveloperCenter/default.mspx
- AJAX.NET的UpdatePanel全面应用(2)
- AJAX.NET的UpdatePanel应用(2)
- AJAX.NET的UpdatePanel全面应用(2)
- AJAX.NET的UpdatePanel应用
- AJAX.NET的UpdatePanel全面应用(1)
- AJAX.NET的UpdatePanel全面应用(1)
- AJAX.NET的UpdatePanel全面应用(3) (客户端)
- AJAX.NET的UpdatePanel全面应用(3) (客户端)
- AJAX.NET的UpdatePanel全面应用(3) (客户端)
- AJAX.NET的UpdatePanel全面应用(1)(转)
- Asp.net Ajax 学习笔记2 UpdatePanel的使用(上)
- Asp.net Ajax 学习笔记2 UpdatePanel的使用(上)
- AJAX.NET之UpdatePanel
- AJAX在ASP.NET中的应用(四)——探寻UpdatePanel的工作原理
- ASP.NET 2.0 AJAX UpdatePanel
- ASP.NET AJAX 的 UpdatePanel 控件不是万能的
- asp.net ajax学习系列功能强大的UpdatePanel控件
- asp.net ajax学习系列功能强大的UpdatePanel控件(转)
- 2007十佳BT客户端,基于c的Transmission也位列其中
- DOM4J解析XML转写TXT
- AJAX.NET的UpdatePanel应用
- ref和out的用法
- Smoke test
- AJAX.NET的UpdatePanel应用(2)
- JAVA网址
- 谈谈JS分层架构的可行性
- Ant简介 (标签)
- MIXERLINECONTROLS结构体定义〔声音控制〕〔转〕
- 人事所想_希望大家也看看
- 印象,浏览
- 删除只读文件
- java