MonoRail学习笔记十六：AJax在MonoRail中的使用

AJax几乎成了web2.0的一个代表，Java和Asp.net中都提供了一些AJax操作的控件。在MonoRail中也同样提供了AJax操作的共通类：AJaxHelper
AJaxHelper可以指定当文本框输入变化时调用后台代码、可以监控一个Form，当Form内控件值变化时调用后台代码、可以在点击一个按钮时调用后台代码，也可以在页面加载时就调用后台代码。当然这些调用都是采用AJax，即无刷新方式的，调用后可以自动更新页面中的一块区域的内容。
使用AJaxHelper后，几乎只要处理自己的业务逻辑就可以了，和AJax有关的代码都封装好了。下面就来看看这几种方式的使用方法：
以下的Controller类都是从SmartDispatcherController继承的
一、监控文本框
Controller代码：

public void index()
{
}

public void InferAddress(Stringzip)
{
RenderText("Address"+zip);
}

其中String zip的zip变量名需要和vm页面中的控件名相同

vm代码：

1 < html >
2 < head >
3 $AjaxHelper.GetJavascriptFunctions()
4 </ head >
5
6 < body >
7 < form id ="theform" >
8 请输入邮政号码: < br >
9 < input type ="text" name ="zip" id ="zip" >
10 < br >
11 < div id ="address" >
12 </ div >
13 </ form >
14
15 $AjaxHelper.ObserveField("%{field='zip',frequency='2',url='inferaddress.rails',update='address',with='Form.serialize(theform)'}")
16
17 </ body >
18 </ html >
19

第三行是注册AJax的脚本，第十五行就是监听zip控件，当输入变化时自动调用inferaddress.rails，将返回的文本更新到dir id="address"的区域中

二、监控Form
vm:

< html >
< head >
$AjaxHelper.GetJavascriptFunctions()
</ head >

< body >
< form id ="myform" >
姓名: < input type ="text" name ="name" id ="name" > < br >
地址: < input type ="text" name ="addressf" id ="addressf" >

< br >
< div id ="message" >
</ div >
</ form >

$AjaxHelper.ObserveForm("myform",2,"FormTest.rails","message",null)
</ body >
</ html >

controller

public void FormTest( string value, string addressf)
{
RenderText(value+"::"+addressf);
}

这里的定义有点奇怪，好像是一个BUG，也可能是1.0 RC3还在开发阶段所致
对Form中的第一个控件："姓名"，在controller必须定义成"value"名才能取得值，而且取得的值也有问题(会在前面加上控件名称)，看下面的执行结果：


三、响应按钮事件
vm:

< html >
< head >
$AjaxHelper.GetJavascriptFunctions()
</ head >

< body >
< div id ="userlist" >
</ div >

$AjaxHelper.BuildFormRemoteTag("UserList.rails","%{update='userlist'}")
< table >
< tr >
< td > 姓名: </ td >
< td >< input type ="text" name ="name" ></ td >
</ tr >
< tr >
< td > 邮件: </ td >
< td >< input type ="text" name ="email" ></ td >
</ tr >
< tr >
< td colspan ="2" align ="center" >
< input type ="submit" value ="增加" >
</ td >
</ tr >
</ table >
</ form >
</ body >
</ html >

controller:

public void UserList(Stringname,Stringemail)
{
IListlist=Session["userlist"]asIList;
if(list==null)
{
list=newArrayList();
}
list.Add(name+""+email+"<br>");
Session["userlist"]=list;

System.Text.StringBuilderuserList=newSystem.Text.StringBuilder();
for(inti=0;i<list.Count;i++)
{
userList.Append(list[i]asstring);
}
RenderText(userList.ToString());

}

这样每次点增加按钮时，就可以不用刷新页面，直接就能把增加的信息显示在指定的位置了，当然你可以执行一些复杂的操作

四、直接调用后台代码
Controller

public void User()
{
RenderText("user:"+Session["name"]asstring);
}

vm:

$AjaxHelper.GetJavascriptFunctions()
< div id ="user" >
</ div >
< script language =javascript >
newAjax.Updater('user','/myajax/User.rails',{});
</ script >

可以在页面加载时就调用指定的User.rails命令，更新user区域