最近的开发中遇到了jquery异步提交表单数据时出现了中文乱码的问题。先说一下开发环境,本地编码格式为GBK(服务器为本机,因此服务器端的编码格式也是GBK了),webwork框架默认编码也是GBK。
第一次出现乱码时,尝试着将webwork的默认编码修改为UTF-8。这样服务器端所接收到的中文字符正常显示,可以确定webwork的参数拦截器在进行参数注入时,客户端所提交的中文数据已经变为乱码,修改webwork的默认编码集显然是不合理的。
首先想到的是使用encodeURI()函数在客服端对用户提交的数据项进行编码,服务器端再用URLDecode类解码。但由于客户端所提交的数据项比较多,对每个数据项都进行编解码会产生大量的与业务无关的代码。最终想到了使用webwork中提供的域模型去接收分散的数据类型,这样可以统一在服务器端对domain实体中的每个属性值进行解码。以下是具体的实现:
客户端:
$("input[type='text']").each(function(){
$(this).val(encodeURI($(this).val()));
}); //表单提交前对每个text控件的value采用encodeURI函数编码
$("#subForm").ajaxSubmit(options); //subForm为要提交的表单的id
//表单提交后,立即解码,防止用户看到编码后的数据
$("input[type='text']").each(function(){
$(this).val(decodeURI($(this).val()));
});
服务器端:
import java.io.UnsupportedEncodingException;
import java.lang.reflect.Field;
import java.lang.reflect.InvocationTargetException;
import java.lang.reflect.Type;
import java.net.URLDecoder;
import java.util.ArrayList;
import java.util.List;
import org.apache.commons.beanutils.BeanUtils;
/**
* @describe: 对javabean中指定类型的属性按照指定的编码集解码
* @author: Nirvana*@version: V1.0 2011-6-20上午10:44:24 create
*/
public class Decoder<T> {
/**
* 在指定的Class中获取指定Type的属性名
* @param objClass 指定与对象相关联的Class
* @param type 对象的属性类型
* @return
*/
private List<String> getPropertyNames(Class objClass, Type type) {
Field[] fields = objClass.getDeclaredFields();
List<String> propertyNames = new ArrayList<String>();
for (Field f : fields) {
if (f.getType().equals(type)) {
propertyNames.add(f.getName());
}
}
return propertyNames;
}
/**
* 按照charset字符解码obj对象中属性类型为指定type的属性值
* @param obj 需解码的javabean
* @param charset 解决字符集
* @param type 需解码的属性类型
* @return 返回解码后的javabean
*/
public T decode(T obj, String charset, Type type) {
List<String> propertyNames = getPropertyNames(obj.getClass(), type);
for (String name : propertyNames) {
try {
String str = BeanUtils.getProperty(obj, name);
if (str == null)
continue;
BeanUtils.setProperty(obj, name, URLDecoder
.decode(str, charset));
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
} catch (NoSuchMethodException e) {
e.printStackTrace();
} catch (UnsupportedEncodingException e) {
e.printStackTrace();
}
}
return obj;
}
}
在服务器端构建一个domain对象的Decoder,再调用decode方法对指定类型的属性值进行解码。目前Decoder只支持基本数据类型和String类型数据的解码。
分享到:
相关推荐
使用jQuery.form插件,实现完美的表单异步提交
jQuery异步提交表单 gailan.apply(gailan, { selectPostFrom:function(){ var data = jQuery("#frmAppendix").formSerialize(); jQuery.ajax({ type:"POST", url:"./selectSubmit.jsp", data:data, success:...
NULL 博文链接:https://chenzheng8975.iteye.com/blog/1922970
基于jquery的异步表单提交【jquery-form.js,其中的Demo是基于SSH的,里面有Struts标签。欢迎下载!
本文为大家分享了两种jQuery异步提交表单的方式,具体内容如下 第一种方式:普通ajax方式提交 $(function(){ $('#send').click(function(){ $.ajax({ type: GET, url: GLOBAL_PATH + /Enterprise/...
jquery.form.js 无刷新异步提交表单js文件 /** * jQuery Form Plugin * version: 3.51.0-2014.06.20 * Requires jQuery v1.5 or later * Copyright (c) 2014 M. Alsup **/
Asp中用法JQuery的AJAX提交中文乱码解决方法_.docx
本文实例讲述了JQuery异步提交表单与文件上传功能。分享给大家供大家参考,具体如下: Jquery.form.js是一个可以异步提交表单及上传文件的插件。 示例如下: index.html <!DOCTYPE html> <html> <head&...
jquery 异步提交的例子。使用的是jquery + servlet 。使用jquery $.get() $.post() 提交请求道servlet 页面
本工程为Java Web工程,演示了如何使用Jquery实现表单的异步提交!
基于jquery的实现异步跨域提交表单的实现代码,需要的朋友可以参考下。
主要介绍了jQuery异步提交表单实例,需要的朋友可以参考下
使用jquery的ajax方法可以异步提交表单,成功后后台返回json数据,回调函数处理,可以不用刷新页面,达到异步的目的; 处理表单的数据可以用serialize()方法进行序列化,而如果提交的数据包括文件流的话,就需要使用...
JQuery表单提交和后台交互源码 源码描述: jQuery表单提交和后台交互,非常简单。 也许你习惯了使用基于jQuery的表单插件,裸写也不错 仅使用jQuery提交表单和后台交互,不使用基于jQuery的表单插件 方式1、取到...
jquery异步调用页面后台方法,jquery异步调用页面后台方法
附件详细说明了异步提交文件的jquery插件的使用方法 详情请下载并解压文件
JQuery 提交表单,步骤详细并且附有详细图解.学习JQUery不能错过