我们先大致的猜想下,前台代码编写过程中,会有哪些功能是可以抽离出来当做公共方法调用的。
1、JS代码编写过程中经常会要用到的方法:
isEmpty(), isT(), isF(), getFunc(), getValByDef()
好吧,我又懒了~~勿喷。
2、消息提示框。
关于这点,自然不能那么俗的用自动的alert和confirm了。目前我们前台是用EasyUi,而EasyUi的信息提示如下:
$.messager.alert('Warning','The warning message'); $.messager.confirm('Confirm','Are you sure you want to delete record?',function(r){ if (r){ alert('ok'); } });
如果我们直接使用的话,第一是太烦了,二是如果今后要换一套提示框,就必须到每一个业务代码中去修改,显然不合理。因此我们先定出以下几个方法:
alert(), alertInfo(), alertWarn(), alertErr(), confirm()。
演示例子见AlertDemo.jsp。
3、与后台的交互,分ajax异步和同步两种,并且额外为from表单提交提供一个ajax的异步方式:
callAjax(), callAjaxSync(), submitFrm()。因此我定义了自己的一个公共js:TT.js。设定全局变量$tt作为工具的实例。
在这里我主要讲下callAjax(),具体代码如下:
callAjax : function(action, data, callback){ $.post(action, data, function(ctrlResult) { $tt.alertCtrlMsg(ctrlResult); if(!$tt.isEmpty(callback)) $tt.getFunc(callback)(ctrlResult); }, "json"); }
callAjax方法接收三个参数:访问的url、传递的参数、回调函数。直接使用的是jquery的post方法,数据传输形式为json。访问后台成功后得到了后台返回的数据,在此,我希望后台统一返回给我的数据crtlResult中有如下几个字段:msg(消息内容),msgType(消息类型,例如error等),value(后台真正要返回的数据)。因此后台定义了一个CtrlResult类用于数据的包裹:
/** 提示信息 */ private String msg; /** 提示信息的类型 */ private String msgType = MSG_TYPE_INFO; /** 返回界面的值 */ private Object value;
如此一来,我就可以通过控制后台返回的数据,在前台自动显示提示信息,并且可以把这些提示信息在后台进行统一的规范。这个在今后的MsgLoader设计时我们在考虑。
对于表单的异步提交,我并没有使用easyui的表单提交,原因是其默认返回的对象为字符串而非json。于是我采用了jquery.form.js,但是我又想了下,没必要为了这么一个简单功能去引入一个jquery插件。于是我就直接采用了刚刚实现的callAjax方法,反而觉得十分简单,而且省了对弹出框代码的编写:
submitFrm : function(jqFrm, action, callback){ action = $tt.isEmpty(action) ? jqFrm.attr( 'action' ) : action; $tt.callAjax(action, jqFrm.serialize(), callback); }
演示例子见AjaxDemo.jsp。
在jsp中,我做了如下规范:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE html> <html> <head> <base href="<%=basePath%>" /> <jsp:include page="/pub/Metas4Base.jsp"></jsp:include> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script src="script/demo/AjaxDemo.js" type="text/javascript"></script> <title>AjaxDemo</title> </head> <body> </body> </html>
用base标签设置当前根路径为工程的根路径,用jsp:include引入Metas4Base.jsp。在这个jsp中,放置了公共的资源,例如js、css,统一使用相对路径的方式(即相对base)。这样可以有利于今后公共资源的修改,例如换easyui的版本等。
不知道为什么,源码一直传不上去,改天传吧!
相关推荐
这篇名为“TT随笔四 前台的CURD封装”的博客文章可能讨论了如何在前端应用中优雅地执行CURD操作。尽管描述为空,我们可以推测作者可能分享了如何使用JavaScript(可能包括ES6语法)或者特定的前端框架如React、Vue或...
【标题】"TT随笔一:啰嗦"的博客文章主要围绕着源码解析和工具应用这两个主题展开,虽然标题看似简洁,但其中蕴含的知识点却颇为丰富。在IT行业中,源码分析和工具的使用是提升开发效率、理解系统运行机制、优化代码...
本篇随笔“TT随笔二 TInit以及TMap”将探讨这两个主题,聚焦于一个特定的初始化过程(TInit)和一种数据结构(TMap)。 首先,让我们来看看TInit。在很多编程语言中,初始化是一种确保对象或变量在使用前处于预定...
"tt数字三"的精确时间对应功能恰恰填补了这一市场空白。该功能可以精准地与彩票开奖的时间节点相对应,使得用户能够清楚地看到每个开奖周期内的数据波动。这对于那些善于发现时间序列规律的购彩者来说,无疑提供了一...
【标题】:“TT随笔五 - Nutz自定义视图以及提示信息的统一管理” 这篇博客文章主要探讨了如何在Nutz框架中实现自定义视图(views)以及如何进行提示信息的统一管理。Nutz是一款轻量级的Java开发框架,它提供了包括...
总的来说,"TT作曲家"是一款功能强大且易于使用的简谱编辑软件,它以其免费且全功能的特点,成为音乐爱好者和初级作曲者理想的创作伙伴。无论你是想记录灵感,还是系统学习乐理,或者是创作自己的音乐作品,"TT作曲...
这个"TT软件代码"是作者初次尝试编程的作品,它主要用于实现计算功能。"tt.r"可能是源代码文件或者某种特定格式的资源文件,与计算器程序相关。"计算器中TT"标签表明该代码是用于构建一个具有TT标识或特色的计算器...
标题“24tt多功能抽奖软件”表明这是一款用于举办晚会抽奖活动的应用程序,它具备多种功能,能够满足不同场合的抽奖需求。描述中的“晚会抽奖软件,很实用,强大”进一步强调了该软件的易用性和高效性,暗示它可能...
"TT网页协议"是一种专为特定网页交互设计的通信协议,它可能包含了高效的数据传输机制、安全认证方式以及特定的请求响应格式。在互联网技术领域,自定义的网页协议往往是为了满足特定应用或服务的需求,比如优化数据...
TT
TT电机(TT马达)三维模型图纸step格式
"Type Tutor(TT)"以其独特的教学模式和强大的功能,赢得了"打字高手之必备"的美誉。它不仅帮助初学者快速掌握正确的打字姿势和技巧,还为有经验的用户提供了提高打字速度和准确性的平台。其核心在于科学的教学体系,...
【标题】"tt.zip_TT_tt名字代码" 涉及的是一份关于统计源代码信息的项目,其中包含了各种类的设计以及类中函数的实现。这个项目的主要目标是统计源代码中的函数数量、代码行数以及与空格相关的函数框架。 【描述】...
tt打字软件,附加dosbox;因为tt是很老的一个dos程序了,在windows下不能直接打开,需要安装dosbox。安装完dosbox之后,打开,并执行一下命令: 》mount c E:\tt 其中E:\tt是存放了tt.exe文件的目录。该命令是指将E:...
《24TT多功能抽奖软件深度解析》 24TT多功能抽奖软件是一款专为各类活动设计的抽奖工具,其最新版本为4.1.5.1,发布日期为2013年12月22日。该软件的核心功能是提供灵活多样的抽奖方式,适用于各种场合,如企业年会...
在第二章中,我们将详细讨论TT的核心功能模块,这些模块构成了TT软件的基础架构,也是吸引用户的关键所在。 2.1. TT提醒模块 TT提醒模块是一个强大的日程管理工具,用户可以设置定时提醒,确保不会错过任何重要的...
5. **交互式操作**:tt二位作图软件可能具备交互式功能,允许用户在图表上直接进行数据点的选择、拖拽,或者通过鼠标滚轮缩放视图,增强数据探索体验。 6. **保存与导出**:完成绘图后,用户可以将图表保存为图像...
24TT多功能抽奖软件是一款功能全面、设置灵活、操作简单、界面美观的电脑抽奖工具。图片、文字、编号全搞定,除抽奖外同时集合会议二维码、照片采集、签名签到、签退,带二维码的入场券打印等参会人员管理功能。操作...