Dorado 9 : 3.3.3 给控件绑定事件

AjaxAction执行成功后,应该获取后台方法的返回值并对前台控件赋值,因此需要对ajaxactionGetSysInfo绑定onSuccess事件。

步骤1:鼠标选中ajaxactionGetSysInfo控件,在右侧工作区中,点击第二个tab页,切换到ClientEvents事件列表,如下图所示:

 

步骤2:双击选择onSuccess事件,主工作区将由下方的Properties切换到Events编辑模式,在事件编辑区中输入如下代码:

var info = self.get("returnValue");
view.set("#labelProduct.text","产品:"+info.product);
view.set("#labelVendor.text","提供商:"+info.vendor);
view.set("#labelVersion.text","版本:"+info.version);
view.set("#labelTime.text","当前系统时间:"+info.time);

info

self表示ajaxactionGetSysInfo这个控件自身,returnValue为AjaxAction控件的属性字段,表示Ajax调用结束后Java层返回的结果。由于 Ajax方法返回的是一个Map对象,在JS中会自动转为JSON对象,这样就可以直接通过 info.product,info.veneor,info.version访问map中的内容。

#labelProduct表示当前页面的labelProduct控件。
view.set("#labelProduct.text","产品:"+info.product);这句代码则表示设置当前页面控件Id为labelProduct的text属性为后台方法的相应返回值。

note

我们也可以将labelProduct,labelVendor,labelVersion,labelTime这四个控件Id作为参数传递到onSuccess方法中,然后在事件中通过控件Id直接引用控件对象。如下图:

优化后onSuccess事件代码如下:

var info = self.get("returnValue");
labelProduct.set("text","产品:"+info.product);
labelVendor.set("text","提供商:"+info.vendor);
labelVersion.set("text","版本:"+info.version);
labelTime.set("text","当前系统时间:"+info.time);

 

步骤3:在我们点击【清空】按钮时,清空页面4个标签显示的信息。鼠标选中buttonClear控件,给按钮绑定onClick事件,我们采用步骤2中将labelProduct,labelVendor,labelVersion,labelTime这四个控件Id作为参数传递到onClick事件的方式,通过控件Id直接引用控件对象,事件代码如下:

labelProduct.set("text","产品:...");
labelVendor.set("text","提供商:...");
labelVersion.set("text","版本:...");
labelTime.set("text","当前系统时间:...");

Attachments:

3.3.3-8.png (image/png)
3.3.3-9.png (image/png)