标签:
谨以此篇文章来记录4月份开发那点事儿。
从去年12月份换工作到现在,主要内容是做接口开发,调用阿里云,Azure,vmware,openstack等国内外云平台restful接口,主要包括创建虚拟机,虚机操作,网络VPC,负载均衡创建等等API操作吧。我做过的最‘牛’的一件事儿就是一次接口调用把某云平台的数据库搞垮了,导致真个机房宕机好几天,可能这个平台太脆了了吧,平台的运维人员都怕了我,哈哈是不是很搞笑。说起来其实蛮无聊的,不过能学的东西还是非常多。互联网公司的项目还是挺不错的,需要多加努力。从3月份公司旅游回来到到现在,接口任务基本完成,其他同事则是负责前台业务的开发,我负责的接口部分最终是以jar包形式提供他们调用。换句话说,接口完成了我一般就没什么太多的事情了,抽空就跟同事学学jquery,bootstrap等等前台技术。虽说技术要精,学一点前台还是不错的。
闲暇时间学学spring+springmvc+mybatis+boostrap搭建一个系统平台,这些东西其实都是在陪他们夜里发版本的时候自己做的,刚好不会的东西直接问同事,他们也很乐于帮助我,这就是做技术最快乐的地方哈哈。
好了,废话不多说啦,开始今天的主题,先看看系统平台的登录页面吧......有些看到后会觉得很眼熟,没错,这个前台模板是网上下载的,做了些调整和校验
在登录表单中利用jquery.validate.js做了相关校验,是不是看上去更舒服点呢,哈哈
注册页面:
这里注明下jquery.validate.js的用法:
1、首先在页面引入js库;
<pre name="code" class="html"><script src="<%=request.getContextPath()%>/static/javascript/jquery-validate/jquery.validate.js"></script>
// 登录表单校验; $("#loginForm").validate({ // 指定展示错误信息的dom元素; errorElement : 'span', // 错误样式; 红色框 errorClass : 'help-block', // 提交表单后,未通过验证的表单中DOM元素会获得焦点,默认为true;为false时dom将不会获得焦点; focusInvalid : true, // 字段校验规则; rules : { user_alias : {required : true}, password : {required : true} }, // 错误详细提示信息; messages : { user_alias : {required : "请输入用户名!" }, password : {required : "请输入密码!" } }, highlight : function(element) { $(element).closest('.form-group').addClass('has-error'); }, // 表单校验成功后; success : function(label) { label.closest('.form-group').removeClass('has-error'); label.remove(); }, // 表单校验失败时,相关DOM元素会增加错误样式; errorPlacement : function(error, element) { element.parent('div').append(error); } });好了,现在登录进去,哦忘记了,数据库这里用的mysql5.5版本,登录后主页如下:
模板左侧提供了丰富的组件,可以较快的了解bootstrap的各个组件如何设计,还是比较不错的,右侧是主页面,这个风格我还是比较喜欢的,你们觉得呢?哈哈,好了,看下个人资料修改页面:
系统设计到的表单我都做了校验,主要用到的是jquery.validate.js,另外通知框用的是toastr.js 这两个插件比较喜欢,可以按照自己的风格进行自定义样式和校验规则,比较不错。好了,先写到这里吧,这就是我两周业余时间来干的事儿,后续的实现功能罗列了一下几点:
1、增加对列表和树形结构的操作;
2、通过接口获取数据json,列表展示同时操作某个记录;
3、引入百度地图API,实现一个路线搜索的模板,哈哈,虽然这个功能和目前系统无关联,无所谓啦,喜欢就去做;
4、编写拦截器,对所有请求进行拦截处理;
5、引入aop编程,对系统日志进行拦截;
。。。。。。巴拉巴拉等等吧,其实想做的东西还有很多呢,太细的就先不写了,先记录到这里吧,ok,写的不好的地方各位多多指点,目前工作一年半,还是个菜鸟中的菜鸟
ace模板的下载地址:http://download.csdn.net/detail/cherishme1988/9501151
标签:
原文地址:http://blog.csdn.net/cherishme1988/article/details/51234944