通过 Parameter 对象添加 Ajax 请求时的参数

之前写了很多 JQueryElement 的文章, 在 JQueryElement 的控件中有很多 Ajax 调用, 为了方便大家的理解, 写了这篇解释 Parameter 对象是如何为 Ajax 添加设置参数的.

示例代码下载: http://zsharedcode.googlecode.com/files/JQueryElementDemo.rar

本文将说明 JQueryElement 当中的 Parameter 对象的作用和使用方法:

* 准备

* 语法

* 参数名

* 参数获取方式

* 默认值

* 数据类型

* 自定义转换函数

* 自动添加的参数

准备

在此之前, 请确保已经了解 JQueryElement 中一些控件的使用.

语法

通过添加 Parameter, 可以为 Ajax 调用增加参数:

代码如下

复制代码

<je:Parameter
    Name="<参数名>" Type="<参数获取方式>"
    Value="<参数表达式>" Default="<默认值>"
    DataType="<数据类型>" Provider="<自定义转换函数>"/>

<je:Parameter Name="name" Type="Selector"
Value="'#txtAName'" DataType="String"/>

每一个 Parameter 都需要包含在 ParameterList 中, 而 ParameterList 是所有 Async 对象的属性, 下面在点击的事件中, 增加了一个名为 name 的参数.

代码如下	复制代码
<ClickAsync Url="webservice.asmx" MethodName="Save" Success=" function(data){ alert(data.d.message); } "> <ParameterList> <je:Parameter Name="name" Type="Selector" Value="'#txtWName3'"/> </ParameterList> </ClickAsync>

参数名

如果调用 WebService, 则参数名和服务器端的参数名是一致的, 比如:

代码如下	复制代码
<je:Button ID="cmdWNet3" runat="server"> <ClickAsync Url="webservice.asmx" MethodName="Save"> <ParameterList> <je:Parameter Name="name" Type="Selector" Value="'#txtWName3'"/> </ParameterList> </ClickAsync> </je:Button>

代码中 Parameter 的 Name 属性设置的参数名为 name, 因此 Save 方法需要一个名为 name 的参数:

代码如下	复制代码
[WebMethod] [ScriptMethod] public SortedDictionary<string, object> Save ( string name ) { }

如果使用 ashx 来接收参数, 则使用 Request['name'] 即可.

参数获取方式

参数获取方式有两种, 一种是 Selector, 这表示 Value 属性是一个选择器, 通过选择器将选择页面上的一个元素, 通常是 input 元素, 将取此元素的值作为参数的值, 另一种是 Expression, 表示 Value 中的是一个 javascript 表达式, javascript 表达式计算的值将作为参数的值:

代码如下

复制代码

<je:Parameter Name="name" Type="Selector" Value="'#txtWName3'"/>

<je:Parameter Name="value" Type="Expression" Value="123 + 321" DataType="Number"/>
<je:Parameter Name="value" Type="Expression" Value="add(123, 321)" DataType="Number"/>

代码中的选择器 #txtWName3 使用了单引号, 因为选择器需要是一个字符串, 如果改成 Value="myselector", 则表示将 javascript 变量 myselector 的值作为选择器.

Value 作为 javascript 表达式, 则形式是多样的, 在代码中, 还调用了 javascript 函数 add.

默认值

通过 Default 属性, 可以设置当参数值为空时的默认值, 是一个 javascript 表达式.

数据类型

可以通过 DataType 转化参数的类型, 比如转化文本框中的字符串为数值类型:

代码如下	复制代码
<je:Parameter Name="name" Type="Selector" Value="'#txtAge'" DataType="number"/>

DataType 属性可以设置为 number, boolean, string, date, 其实, 在服务器端 WebService 自身也会进行一些转化, 详细可以参考 Ajax 与 WebService 之间日期等数据类型的转换.

自定义转换函数

如果设置了 DataType, 则可以另外的设置 Provider 来提供自定义转换函数, 自定义转换函数将在不能正常转换时调用, 比如:

代码如下	复制代码
<je:Parameter Name="name" Type="Selector" Value="'#txtAge'" DataType="number" Provider=" function(value){ if(value == '不惑') return 40; else return 18; } "/>

上面的代码中, 如果用户输入的年龄为不惑则将转化为 40, 否则为 18.

自动添加的参数

在一些控件的事件中, 会自动的添加一些参数, 比如 Repeater 的 FillAsync 中会添加 pageindex, pagesize 来表示页码等信息.

JQueryElement 是开源共享的代码, 可以在 http://code.google.com/p/zsharedcode/wiki/Download 页面下载 dll 或者是源代码.

欢迎访问 panzer 开源项目, http://zsharedcode.googlecode.com/ , 其中包含了 IEBrowser 控制 WebBrowser 执行各种 js 和 jQuery 脚本以及录制功能和 jQueryUI 的 Asp.net 控件 JQueryElement

补充：asp.net教程,.Net开发