UpdatePanel作为微软应以为豪的ajax的核心控件
另:在aspx页面中必须添加一个ScriptManager控件
aspx页面中只需要添加一个button1就OK
功能不是一下俩下能学完的~最近又用到了不少新功能,大概介绍下~
使用ajax的目的就是减少网络数据传输量,提高体验!
使用UpdatePanel的时候要注意下面俩点:
1,一个页面中尽量多使用几个UpdatePanel,必要时候可以适用恰套
如果为了无刷新而使用updatePanel,一个页面中的所有元素都包含在updatepanel中,为了刷新部分内容而提交整个页面的数据以及状态,和传统的postBack没有区别,就谈不上减少网络传输量
2,尽量把UpdatePanel的UpdateMode属性设置为condition
如果UpdatePanel的UpdateMode属性设置为always ,不管什么提交,页面中所有的updatePanel都会刷新,还是会加大网络传输量,所以这俩点应该配合使用
下面的例子是我学习动态添加UpdatePanel的cs代码:
- public partial class _Default : System.Web.UI.Page
- {
- protected void Page_Load(object sender, EventArgs e)
- {
- UpdatePanel up = new UpdatePanel();
- //动态添加控 控件ID要自己设定,我原本以为上面的up就是ID,对象名字和对象ID不同( 个人理解)
- up.ID = "UpdatePanel1";
- //添加到 Form.Control中
- this.Form.Controls.Add(up);
- LiteralControl lc = new LiteralControl(DateTime.Now.ToString());
- //把LiteralControl控件添加到 updatepanel内
- up.ContentTemplateContainer.Controls.Add(lc);
- Button bt = new Button();
- bt.ID = "Button1";
- bt.Text = "Button";
- up.ContentTemplateContainer.Controls.Add(bt);
- }
- }
另:在aspx页面中必须添加一个ScriptManager控件
下面记录下 asp.net 2.0中脚本注册和异步更新环境中脚本的注册
- using System;
- using System.Collections;
- using System.Configuration;
- using System.Data;
- using System.Web;
- using System.Web.Security;
- using System.Web.UI;
- using System.Web.UI.HtmlControls;
- using System.Web.UI.WebControls;
- using System.Web.UI.WebControls.WebParts;
- namespace AJAXEnabledWebApplication1
- {
- public partial class WebForm1 : System.Web.UI.Page
- {
- protected void Page_Load(object sender, EventArgs e)
- {
- this.Button1.Click+=new EventHandler(btnClick);
- }
- protected void btnClick(object sender, EventArgs e)
- {
- //虽然这种方式也是一种注册代码的方法,但是这种注册
- //代码的结果使得代码输出在html文件的最顶端,破坏了page对象的结构,
- //不推荐使用
- //Response.Write("<script type='text/javascript'>alert('hello world')</script>");
- //页面的ClientScript方法返回一个ClientScriptManager对象
- ClientScriptManager cs = this.ClientScript;
- //注册一个数组 var arr=new Array(1,2,3,4,5);
- //不推荐 cs.RegisterArrayDeclaration("arr", "3"); 这样生成
- // var arr=new Array(3);申明了个长度为3的空的arr数组
- cs.RegisterArrayDeclaration("arr", "1,2,3,4,5");
- //注册一个函数helloWorld() 后面的true参数提示自己给注册脚本的俩便添加<script></script>标签
- //如果选择不输入,或者输入false则 函数应该写成<script>function helloWorld(){alert('Hello World');}</script>
- cs.RegisterClientScriptBlock(this.GetType(), "helloWord", "function helloWorld(){alert('Hello World');}",true);
- //注册一个js文件的引用
- cs.RegisterClientScriptInclude(this.GetType(), "helleoWorld","js的url");
- //注册一个资源文件
- //cs.RegisterClientScriptResourc();
- //给button1空间注册一个属性:名字为:name ,值为button
- //使用控件的ID最好使用控件的ClientID
- cs.RegisterExpandoAttribute(this.Button1.ClientID, "Name", "button");
- //注册一个隐藏控件
- cs.RegisterHiddenField("name", "value");
- //返回一个值 如果为 true 继续执行,false 不执行
- cs.RegisterOnSubmitStatement(this.GetType(), "IsPost", "return window.confirm('真的提交么?');");
- //
- //向页面输送代码和RegisterClientScriptBlock不同的是,这个在 form的下面,最先执行
- cs.RegisterStartupScript(this.GetType(), "loadIsFinish", "alert('load is finished');", true);
- }
- }
- }
下面是浏览注册后生成的结果
在异步更新环境中脚本注册是ScriptManger控件中提供了和上面相同的8个方法,使用方法也是一样的,不同的一点下面的代码中记录下:
- //cs.RegisterHiddenField("name", "value");
- <input type="hidden" name="name" id="name" value="value" />
- // cs.RegisterClientScriptBlock(this.GetType(), "helloWord", "function helloWorld(){alert('Hello World');}",true);
- <script type="text/javascript">
- //<![CDATA[
- function helloWorld(){alert('Hello World');}//]]>
- </script>
- //cs.RegisterClientScriptInclude(this.GetType(), "helleoWorld","js的url");
- <script src="js的url" type="text/javascript"></script>
- // cs.RegisterOnSubmitStatement(this.GetType(), "IsPost", "return window.confirm('真的提交么?');");<script type="text/javascript">
- //<![CDATA[
- function WebForm_OnSubmit() {
- return window.confirm('真的提交么?');
- return true;
- }
- //]]>
- </script>
- // cs.RegisterArrayDeclaration("arr", "1,2,3,4,5");
- <script type="text/javascript">
- //<![CDATA[
- var arr = new Array(1,2,3,4,5);
- //]]>
- </script>
- // cs.RegisterExpandoAttribute(this.Button1.ClientID, "Name", "button");
- <script type="text/javascript">
- //<![CDATA[
- var Button1 = document.all ? document.all["Button1"] : document.getElementById("Button1");
- Button1.Name = "button";
- //]]>
- </script>
- // cs.RegisterStartupScript(this.GetType(), "loadIsFinish", "alert('load is finished');", true);
- <script type="text/javascript">
- //<![CDATA[
- alert('load is finished');Sys.Application.initialize();
- //]]>
- </script>
- //可以给控件注册,也可以给page注册,利用了type和key组合保证了代码只输出一次(this.GetType(), "hello", )
- //ScriptManager.RegisterClientScriptBlock比clientScriptManger 多了一个type参数,目的上面说了,可以重复注册,但是只输出一次
- ScriptManager.RegisterClientScriptBlock(this.Button1.ClientID, this.GetType(), "hello", "function helloWord(){alert('hello word');}", true);
- ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), "hello", "function helloWord(){alert('hello word');}", true);
今天就总结这么多~
..