a.制作登录界面

(T1A)制作登录界面概述在实际开发这个项目的基本功能页面之前,我们需要先设计这个项目的登录界面.
界面效果如下:实现思想:利用AJAX技术通过dorado的RPCCommand组件完成登录验证.
并根据验证结果由RPCCommand负责页面的跳转或显示错误信息提示.
视图模型配置添加视图模型对象首先,在src中添加目录com\bstek\dorado\demo\hr,并在hr目录下新建Login视图模型,视图模型添加办法如下:图表41选择hr并打开右键菜单,选择new中的View图标.
并将该View命名为Login.
视图模型的详细说明参考附录三:视图模型基本概念说明以及视图模型实现类说明.

添加dataset对象在Login视图模型中的Datasets节点下创建一个FormDataset(dsLogin)来保存用户登录时输入的用户名和密码信息,添加方法如下,选择Datasets节点,并利用鼠标右键选择FormDataset:图表42该快捷按钮会自动在datasets节点下添加FormDataset类型的Dataset对象.
我们修改新增的dataset的id为dsLogin.
并展开dsLogin节点,选择Fields节点,利用快捷按钮添加两个新的Field对象.
快捷按钮如下:新加的field对象的属性设置分别为用户名id和密码pwd,数据类型(dataType)都设置为string.
最终结果如下:图2添加AutoForm选择Controls节点对象,并利用左侧快捷工具栏上的快捷按钮添加AutoForm组件:将新增的AutoForm对象的id属性修改为frmLogin.
并设定frmLogin的dataset属性为dsLogin.
frmLogin的基本属性设置如下:图表43该菜单会自动的利用dsLogin的字段生成其内部元素,展开frmLogin对象,可以看到一个元素,这是自动生成的对象,我们设定自动生成的FormGroup的columnCount属性为"1",title属性为"登录".
如下图:图表45添加label和button重新选择Controls节点,并利用左侧的快捷按钮添加Label组件,如下:增加一个Label组件,并设定id为labelDesc,text属性为"*用户名:admin密码:admin*".
同上方式添加一个Button组件.
并设定新增按钮的id为btnLogin,width为60,value为"登录".
添加后系统效果如下.

AutoForm引入label和button下一步我们利用AutoForm的容器功能,使将新增的两个组件对象引入到AutoForm中.
选择frmLogin的节点,并利用快捷按钮添加两个CustomElement:设定新增的两个CustomElement的属性如下:图表46其中的controlId属性分别设定为btnLogin,labelDesc,使得这两个自定义的元素与前面添加的Label以及按钮绑定.

添加RPCCommand对象增加一个RPCCommand(cmdLogin),设置method属性为loginRPC,表示该RPCCommand要调用的远程方法名为loginRPC.
如下图:图表47选择cmdLogin对象,并选择右侧的事件列表中的beforeExecute事件:图表48双击打开事件编辑器,并从dsLogin中取出用户名id和密码pwd放到cmdLogin的parameters中.

varid=dsLogin.
getValue("id");varpwd=dsLogin.
getValue("pwd");command.
parameters().
setValue("id",id);command.
parameters().
setValue("pwd",pwd);并选择cmdLogin的onSuccess事件,打开事件编辑器输入如下的代码:open('main.
jsp','_self');该事件在登陆校验成功之后触发.
通过open方法我们将当前的页面跳转到主界面上,main.
jsp会在第五章实现.

前面我们把输入参数(用户名和密码)保存在RPCCommand中,并设定按钮对象(btnLogin)的command属性为cmdLogin.
其他属性设定如下图:图3这样按钮被单击时,会自动地执行cmdLogin的执行命令,并执行beforeExecute方法实现参数赋值操作,并利用Dorado提供的远程方法调用与服务器交互,下一步我们就是要在服务器定义一个java类,接受该远程调用并实现登陆验证.

添加视图模型实现类切换到PropertiesInspector标签页,并选择Login视图模型的根节点,并利用右键的快捷菜单生成ViewModel的实现类,命名为LoginViewModel.
这样向导会自动地在com.
bstek.
dorado.
demo中生成LoginViewModel.
java文件,并同时修改Login视图模型的clazz属性为com.
bstek.
dorado.
demo.
LoginViewModel,使的新增的java类与Login视图模型相关联:该类在dorado中的术语是视图模型实现类.
基本概念参考附录三:.
视图模型基本概念以及实现类说明在新生成的视图模型实现类中将Sample_PRC_Method方法名称修改为loginRPC.
然后通过下列代码实现用户名和密码的验证.

代码示范:publicvoidloginRPC(ParameterSetparameters,ParameterSetoutParameters)throwsException{//从输入参数中取出用户名和密码Stringuser=parameters.
getString("id");Stringpassword=parameters.
getString("pwd");//验证用户名和密码if(StringHelper.
isNotEmpty(user)){if(!
"dorado".
equals(password)){thrownewException("passwordfailure!
");}}else{thrownewException("IDfailure!
");}}loginRPC方法通过该函数的参数parameters获取cmdLogin发送过来用户登录时输入的id以及pwd信息.
该处的用户名以及密码校验我们采用比较简单的判断处理.
实际开发可灵活变通.
JSP设计登录逻辑处理完成之后,还需要生成登录的JSP页面.
下面我们利用视图模型提供的JSP生成向导生成登陆页面,方式如下:Login视图模型中选中view(根节点),鼠标右键点选择Generateasample左边的工具按钮(GenerateasampleJSP)图6选择JSP的生成位置,我们选择web,点OK按钮确定.
此时系统会自动生成JSP页面,再编写代码如下:JSP中通过如下的代码使它与我们创建的Login视图模型建立关联关系:删除标签,并调整JSP的页面布局如下:其中的Layout为dorado提供的辅助布局的标签对象,该标签对象的详细说明可以参考>.

重新启动服务.
利用jsp右键的Brower功能在浏览器地址中访问login.
jsp页面:或者再浏览器中输入如下地址:http://localhost:8180/hr/login.
jsp得到如下的界面:图8这样我们就完成了一个简单的登录界面制作.
功能增强为了使登录界面的使用更为人性化,下面我们再来处理一些细节,比如:登陆界面支持快捷键处理:如输入用户名和密码之后按回车就直接执行登录操作;登录失败弹出错误提示信息;登陆成功就进入系统主界面;快捷键处理下面我们利用编辑框的onKeyDown事件实现回车登陆:onKeyDown事件在DHTML中的解释为:当用户按下键盘按键时触发.
下面我们直接获得frmLogin的编辑框,并定义onKeyDown事件,同时判断键盘码是否为13,表示回车事件,如果为回车事件则执行登陆RPCCommand命令.
AutoForm拥有自动生成界面元素的机制,这些界面元素细化到最终就是一些编辑框和Label或按钮对象.