默认情况下,要使用WebWork的客户端校验需要使用xhtml theme,但是这个theme会自动生成布局用的表格,给我们的页面布局带来不便。
查看了生成这些校验的ftl模板后,发现直接修改simple中的几个模板就可以xhtml theme中的校验功能。
步骤如下:
1. 将webwork-2.xx.jar中的template中的xhtml和simple个目录拷到 WebRoot/template目录下,修改webwork.properties文件让webwork使用这个目录下的simple theme。这里拷xhtml目录,只是为了使用里面的ftl模板,也可以只拷用到的几个模板。
2. 修改simple目录中的form.ftl,在文件的第一行加入
java 代码
1. <#include "/${parameters.templateDir}/xhtml/form-validate.ftl" />
这个模板将导入所需要的js文件。
3. 修改simple目录中的form-close.ftl,在文件的最后面增加一行
java 代码
1. <#include "/${parameters.templateDir}/xhtml/form-close-validate.ftl" />
这将生成校验用的js代码。
4. 修改xhtml目录中的form-close-validate.ftl,让错误信息通过alert的方式显示出来。在遇到的第一个
java 代码
1. <script>
标签的后面加入下面的代码
java 代码
1. var errorMessages = "";
2.
3. function addError(field,error){
4. if(errorMessages)
5. errorMessages+="\n"+error;
6. else
7. errorMessages+=error;
8. }
errorMessages用于保存所有的错误信息。addError用于覆盖xhtml/validation.js中的同名函数。再往下找到
java 代码
1. function validateForm_${parameters.id}() {
2. form = document.getElementById("${parameters.id}");
3. clearErrorMessages(form);
4. clearErrorLabels(form);
修改为
java 代码
1. function validateForm_${parameters.id}() {
2. form = document.getElementById("${parameters.id}");
3. clearErrorMessages(form);
4. clearErrorLabels(form);
5. errorsMessage="";
在文件的底部找到
java 代码
1. </#list>
2.
3. return !errors;
4. }
5. </script>
6. </#if>
修改为
java 代码
1. </#list>
2. if(errors){
3. alert(errorMessages);
4. errorMessages="";
5. }
6. return !errors;
7. }
8. </script>
9. </#if>
清除错误信息,避免错误信息重复出现。
分享到:
相关推荐
java私塾][Spring讲解+webwork2整合+webwork2整合全套,欢迎下载!
webwork工作原理作了清楚的讲述。画了重点,非常适合初学阅读时抓住重点。
对WebWork初学者很实在的例子!
WEBWORK的配置
webwork教程webwork教程webwork教程webwork教程webwork教程webwork教程webwork教程webwork教程webwork教程webwork教程webwork教程webwork教程
WEBWORK的源文件压缩包WEBWORK的源文件压缩包WEBWORK的源文件压缩包WEBWORK的源文件压缩包WEBWORK的源文件压缩包WEBWORK的源文件压缩包WEBWORK的源文件压缩包WEBWORK的源文件压缩包WEBWORK的源文件压缩包
文档,word形式专门描述webwork验证功能
webwork源码下载
webwork底层源码,用于webwork框架设计
这是webwork1的jar包,还有webwork-2.2.7.jar和webwork-src-2.2.7.jar
webwork中文帮助文档 webwork中文帮助文档 webwork中文帮助文档 webwork中文帮助文档 webwork中文帮助文档 webwork中文帮助文档
WebWork完全自学!
webWork中文教程
webwork_框架文档
webwork2.1.7
与下载的<<WebWork docs -- webWork 详细的说明文档>> 的文件夹合并. 这里包括了所有webWork的所有的详细说明文档, 任何有关的问题都可以在这里找到答案.
webWork 详细的说明文档, 由于我的上传大小有限, 这个好东西我只能是分两次上传了, 下载的人可能要辛苦一些了, 不过这些都是值得的, 将<<WebWork docs 2 -- webWork 详细的说明文档>> 也一同下载下来, 下载后两个...
spring与webwork的集成 spring与webwork的集成
WebWork2配置WebWork2配置WebWork2配置WebWork2配置
包括webwork2.x的 具体使用步骤,见解压后“webwork使用步骤.txt” 和一个实现前后台连通的webwork具体应用的“test” 实例,将test导入eclipse的工作空间,即可正常运行