admin 管理员组

文章数量: 887031


2024年1月14日发(作者：activity和action的区别)

Coolite Toolkit学习笔记一：AjaxEvent、AjaxMethod和Listeners

一：AjaxEvent

Coolite Toolkit所提供的AjaxEvent可以应用在很多的控件中，实现异步提交等相关功能。比如使用在Coolite Toolkit的Button控件中，通过该控件提供的机制就可以方便的使用。

1

7

8

9

10

11

如果需要使用在标准控件或是其他的html标签元素上，则需要通过Coolite

Toolkit所提供的ScriptManager来实现了，下面简单演示将AjaxEvent使用在官方的Button控件上。

通过上面这种方式，可以把AjaxEvent添加到任何的html元素上（比如：input,div,p,span等等）。

二：AjaxMethod

Coolite Toolkit所提供的AjaxMethod功能和 AJAX的PageMethod是一样的，使用非常简单，详细可参考下面的简单示例：

[AjaxMethod]

public

string PageMethod()

{

return

"调用了页面后置方法：PageMethod()";

}

通过Coolite Toolkit提供的thods.方法名直接调用后置方法。相互之间传递数据（简单文本串,对象,JSON）支持多种格式，这 点和 AJAX是一样的。除此之外，Coolite Toolkit还提供了更强大的页面方法调用功能，就是他可以调用母版页(MasterPage)和用户自定义控件(UserControl)里的方法。 如果要调用母版页的方法，则需要在对应的母版页里提供AjaxMethod方法接口，并为其通过AjaxMethodProxyIDAttribute配 置代理生成策略，如所示：

[AjaxMethodProxyID(IDMode = )]

public partial class MyMaster : Page

{

[AjaxMethod]

public string PageMethod()

{

return "调用了母版页的后置方法：PageMethod()";

}

}

前台页面调用：

<%@ Page Title="" Language="C#" MasterPageFile="~/" AutoEventWireup="true"

CodeBehind="" Inherits="Demo" %>

如果是调用用户自定义控件里的方法，方式和母版页相差不大，不同的是UserControl需要设置别名才能成功调用。如下示例：

[AjaxMethodProxyID(IDMode = , Alias = "UC")]

public partial class TimeControl : ntrol

{

[AjaxMethod]

public string PageMethod()

{

return ng();

}

}

客户端使用别名调用如下：

{

success:function(result)

{

(result);

}

});" />

三：Listeners

Listeners在本文前面就用到过，通过Listeners给Ext按扭添加了一个客户端方法Handler，用得多的也就是他的Click事件，其他的我现在也还没用到，这里小记一下。以后用到了他的其他特性后在补充上来。

注：本文内容参考于官方文档和示例整理而成，只当是自己记录的一份学习笔记，供大家一起交流学习心得。

Coolite Toolkit官方网站：/

Coolite Toolkit学习笔记二：服务器端Alert,Confirm,Prompt

一：Alert

Alert组件最简单的用法就是直接弹出一个消息提示框：

protected void Button_Click(object sender, AjaxEventArgs e)

{

("标题内容", "消息内容").Show();

}

如果我们需要在弹出的提示框点了“确定”以后要执行其他操作怎么办呢？这时候可以使用Alert方法的重载方法，通过JFunction指定一个客户端方法，点了“确定”后就指定相应的客户端JavaScript方法，使用如下：

protected void Button_Click(object sender, AjaxEventArgs e)

{

("标题内容", "消息内容", new JFunction { Fn = "JsMethod" }).Show();

}

Coolite Toolkit还为Alert提供了四中图标UI效果，他们分别是问题(Question)、警告(Warning)、错误(Error)和信息 (Informational)，使用不同的参数将构建出不同的Alert显示风格。使用方法如下：

protected void Button_Alert(object sender, AjaxEventArgs e)

{

(new

{

Title = "图标提示框",

Message = "这个框带个图标",

Buttons = ,

Icon = ,

AnimEl = ID

});

}

图标的取值可以直接通过枚举设置，分别定义有：NONE、ERROR、INFO、QUESTION和WARNING。

除 了上面的应用外，还可以通过Configs来配置Alert的高级应用，比如配置确认对话框，根据不同选择执行不同的 AjaxMethod方法（下面代码里的NS为通过ScriptManager指定的客户端名称空间，其功能等同于

thods）。

protected void Button_Click(object sender, AjaxEventArgs e)

{

("标题内容", "消息内容", new sConfig

{

Yes = new Config

{

Handler = "()",

Text = "确定"

},

No = new Config

{

Handler = "()",

Text = "取消"

}

}).Show();

}

[AjaxMethod]

public void DoYes()

{

("操作提示", "你刚刚点了-确定").Show();

}

[AjaxMethod]

public void DoNo()

{

("操作提示", "你刚刚点了-取消").Show();

}

注：点了“确定”后直接执行服务端的另一方法没有实现出来，还望实现过的朋友指点，谢谢。

二：Confirm

上面通过Coolite Toolkit的扩展功能将Alert组件实现了Confirm的效果，其实Confirm自身的功能也是非常强大的，同Alert一样，最简单的使用则是直接弹出确认对话框。

protected void Button_Confirm(object sender, AjaxEventArgs e)

{

m("操作提示", "消息内容").Show();

}

如果要知道是点击了那一个操作按扭，则同样可以通过JFunction指定一个客户端的JavaScript方法用来接收操作结果。

protected void Button_Confirm(object sender, AjaxEventArgs e)

{

m("操作提示", "消息内容",

new JFunction

{

Fn = "ShowResult"

}).Show();

}

Confirm同样也可以定制根据操作调用AjaxMethod，实现方式和本文前面的Alert实现方式一样。

三：Prompt

Prompt可应用于简单的是数据录入，Coolite Toolkit里的服务端Prompt使用非常简单，同上面Alert和Confirm一样通过JFunction指定客户端方法处理操作结果。

protected void Button_Prompt(object sender, AjaxEventArgs e)

{

("数据录入", "请在下面录入数据",

new JFunction

{

Fn = "showResultText"

}).Show();

}

以上实现的是单行的Prompt，Coolite Toolkit也提供了多行支持，使用如下：

protected void Button_Prompt(object sender, AjaxEventArgs e)

{

(new

{

Title = "数据录入",

Message = "请在下面录入数据：",

Width = 300,

Buttons = EL,

Multiline = true,

AnimEl = ID,

Fn = new JFunction { Fn = "showResultText" }

});

}

上图效果主要是通过()方法，通过该方法还可以定制许多我们需要的UI效果，比如说定制一个进度条效果，其实现为如下代码片段：

protected void Button_Wait(object sender, AjaxEventArgs e)

{

(new

{

Title = "请等待",

Message = "系统正在加载，请等待",

ProgressText = "系统加载中",

Width = 300,

Progress = true,

Closable = false,

AnimEl = ID

});

ongAction();

}

private void StartLongAction()

{

n["Task1"] = 0;

serWorkItem(LongAction);

ask("Task1");

}

private void LongAction(object state)

{

for (int i = 0; i < 10; i++)

{

(1000);

n["Task1"] = i + 1;

}

("Task1");

}

protected void RefreshProgress(object sender, AjaxEventArgs e)

{

object progress = n["Task1"];

if (progress != null)

{

Progress(((int)progress) / 10f, "");

}

else

{

sk("Task1");

();

ipt("ProgressResult();");

}

}

TaskID="Task1"

Interval="1000"

AutoRun="false">

Coolite Toolkit学习笔记三：基本控件之Button、TextField、DataField、ComBox

Button、TextField、DataField、ComBox这些控件好象也没什么好学的，任何一个学过的朋友都应该 会使用这些控件，Coolite Toolkit里的这些控件相比标准的控件提供了需要特殊的功能，比如DataFiled控件在.NET Framework里则是没有的，这些控件在系统开发中是非常有用的。

一、按扭(Button)控件

Coolite Toolkit里同样提供有四种Button控件，他们分别是Button、ImageButton、LinkButton和SplitButton。Button在前两篇笔记里都有使用到，这里就简单记录一下，触发同步事件：

使用Listeners为控件添加客户端方法：

使用AjaxEvents为控件添加Ajax处理方法：

/******************************************************/

protected void Button3_Click(object sender, AjaxEventArgs e)

{

("标题", "显示的消息内容").Show();

}

另外还有一个重要的特性就是按扭菜单项，可以给一个按扭添加菜单选项，使用如下：

关于按扭(Button)控件，目前我也就了解了这些，也只用到了这些，更多高级的内容待需要的时候在研究。

ImageButton 使用得也比较多，通过设置按扭的图片让按扭呈现出不同的风格，不过Coolite Toolkit的ImageButton控件和微软的有些不一样，微软的只能设置一张显示图片，如果要做动态交互效果只能通过样式或脚本程序去控 制，Coolite Toolkit却直接提供了对外属性，只需要简单设置就可以完成一个丰富的界面交互效果的按扭，其功能点和ext:Button是一样的，如下所示：

runat="server"

ImageUrl="button/"

OverImageUrl="button/"

DisabledImageUrl="button/"

PressedImageUrl="button/">

SplitButton没感觉到有什么特别之处，可能我学艺未深吧~~~~

二、TextFiled控件

TextFiled控件等同于里的 TextBox控件，主要进行文字数据录入或显示，反之就是NumberFiled控件专们用来进行数字录入的。TextFiled控件的使用在简单不过 了，这里我想提的是他的几个特性属性:EmptyText属性用来设置或获取显示输入数据提示信息。Note属性用来设置或获取静态描述信息，并可以通过 NoteAlign属性设置信息的显示位置。

三、DataFiled控件

这个控件作用比较大，很多地方都用得到。直接通过其SelectedData属性得到所选择的日期。效果如下：

四、ComboBox控件

ComboBox 控件的基本功能和.NET标准控件的DropDownList控件相同，不同之处在于DropDownList只能选择，不能进行编辑录入，如果用户需要 一个既可手工输入又可以选择的功能来做条件筛选，DropDownList则实现不了，Coolite Toolkit正好弥补上了DropDownList的不足。使用方式两者都相差不大，下面是一个简单的示例：

另 外Coolite Toolkit的ComboxBox还提供了Triggers和Listeners，通过这两个集合可以为ComboBox定制更高级的应用。根据字面意 思就可以猜到，一个触发器一个监听器，那么这两者配合能实现什么样的效果呢？先看看下图：

上面表示了ComboxBox的三种状态：未输入和未选择状态、下拉选择项状态和选中项后的状态，要实现这个效果就需要用到Triggers和Linteners这两个特性了，详细如下代码片段：