AjaxPro客户端框架总结
由于微软构建asp.net 2.0时对ajax技术的不重视，在04、05年ajax风起云涌之时，在asp.net出现了AjaxPro这个Ajax框架，虽然随着asp.net ajax的发布，AjaxPro被强大的asp.net ajax的光芒覆盖，但AjaxPro的简单易用性方面还是非常不错的。
AjaxPro在客户端会输出三个Core.ashx、Converter.ashx和Prototype.ashx三个文件，其实就是javasript文件。其中Prototype.js对Object建立了extend，然后在extend上增加了Apply和Bin方法，之后的Ajax调用的核心文件Core.ashx就是基于extend上进行的。Prototype.js里对Array,String进行扩展并增加了2个事件方面的方法addEvent与removeEvent方法。
Array对象扩展:
push: function(o) {
this[this.length] = o;
},
addRange: function(items) {
if(items.length > 0) {
for(var i=0; i<items.length; i++) {
this.push(items[i]);
}
}
},
clear: function() {
this.length = 0;
return this;
},
shift: function() {
if(this.length == 0) { return null; }
var o = this[0];
for(var i=0; i<this.length-1; i++) {
this[i] = this[i + 1];
}
this.length--;
return o;
}
String对象的扩展:
trimLeft: function() {
return this.replace(/^\s*/,"");
},
trimRight: function() {
return this.replace(/\s*$/,"");
},
trim: function() {
return this.trimRight().trimLeft();
},
endsWith: function(s) {
if(this.length == 0 || this.length < s.length) { return false; }
return (this.substr(this.length - s.length) == s);
},
startsWith: function(s) {
if(this.length == 0 || this.length < s.length) { return false; }
return (this.substr(0, s.length) == s);
},
split: function(c) {
var a = [];
if(this.length == 0) return a;
var p = 0;
for(var i=0; i<this.length; i++) {
if(this.charAt(i) == c) {
a.push(this.substring(p, i));
p = ++i;
}
}
a.push(s.substr(p));
return a;
}
String对象还增加了2个静态方法:
format: function(s) {
for(var i=1; i<arguments.length; i++) {
s = s.replace("{" + (i -1) + "}", arguments[i]);
}
return s;
},
isNullOrEmpty: function(s) {
if(s == null || s.length == 0) {
return true;
}
return false;
}
可以看到扩展的方法都是C#风格的，使得在javasript中能如C#中一样进行字符串与数组操作。 更重要的是Converter.js中增加了DataTable、DataSet、Dictionary和NameValueCollection，使得我们可以在客户端组装以上对象并在需要的时候发往服务端。可以想象在服务端的ajax方法接受一个DataTable类型的参数，那是如何的愉快。
一、DataTable
客户端代码：
function SendDataTable() {
var dataTable = new Ajax.Web.DataTable();
dataTable.addColumn("id", "System.Int32");
dataTable.addColumn("name", "System.String");
var row = new Object();
row.id = "001";
row.name = "xiaopang";
dataTable.addRow(row);
var ret = ZyYz_Default.HanderDataTable(dataTable);
alert(ret.value);
}
服务端代码:
[AjaxPro.AjaxMethod]
public int HanderDataTable(DataTable dataTable)
{
foreach (DataRow dataRow in dataTable.Rows)
{
//do somethig...
}
return 1;
}
二、DataSet(基本同DataTable，只是类型为Ajax.Web.DataSet)
三、Dictionary:
客户端代码:
function SendDictionary() {
var dictionary = new Ajax.Web.Dictionary("Dictionary
", [["004", "xiaopang"], ["005", "xiaopang005"]]); dictionary.add("006", "xiaopang006"); alert("是否存在005元素:" + dictionary.containsKey("005") + "值为:" + dictionary.getValue("005")); var ret = ZyYz_Default.HandDictionary(dictionary).value; alert("Dictionary元素数目:" + ret); }
服务端代码:
[AjaxPro.AjaxMethod]
public int HandDictionary(Dictionary<string, string> dictionary)
{
return dictionary.Count;
}
四、关于直接传递Class
服务端代码:
public class TestClass
{
public int Id{ get; set; }
public string Name { get; set; }
}
[AjaxPro.AjaxMethod]
public TestClass GetTestClass()
{
return new TestClass{ Id =002,Name="oldXiaoPang"};
}
[AjaxPro.AjaxMethod]
public TestClass PutTestClass(TestClass testClass)
{
testClass.Id = 003;
return testClass;
}
客户端代码:
function GetTestClass() {
var testClass = ZyYz_Default.GetTestClass().value;
testClass.Name = "newName";
var newTestClass = ZyYz_Default.PutTestClass(testClass).value;
alert("原Id为:" + testClass.Id + " 现Id为:" + newTestClass.Id);
alert(" 现Name为:" + newTestClass.Name);
}
关于core.js的ajax核心方法还没有仔细看。