datagrid直接编辑保存“设计缺陷”

datagrid直接编辑保存“设计缺陷”

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

当今使用easyUIdatagrid组件的时候,碰到了一些问题,记录下来以便下次高速解决。

需求是在一张表单里会关联有一个列表,能够增删查改

曾经没用easyUI的时候,这个增和改的页面我通常是用一个dialog来做。保存之后再ajax传到列表里通过hidden来进行提交。

当然如今我也能够这么做,可是我想换种方式,由于easyUIdatagrid提供了直接在datagrid上编辑的功能(Row Editing in DataGrid)。

照着官网上的demo试了一下。也就是editor的应用。编辑倒是没问题,保存也OK

可是保存的时候是直接把value转换成text来保存的。这么一来的话,value的信息就消失了。

比方说是一个combobox。那么保存完就仅仅有text的信息了。

那在保存完之前总是能获取到value的。试了一下,第一想法是想从editor生成的input下手得到数据,毕竟用form来提交是最熟悉的方式啊,可是发现editor都没有指定name的地方(或许是我不知道),所以不好得到数据。既然不行,那么还是通过datagridgetSelected方法来得到当前选中行(这里要先停止当前的编辑(endEdit)之后才干拿到填的数据)。

var row = $('#dispatches_details').datagrid('getSelected');

这里得到的row是一个json,且里面的combobox得到的都是value

到了这步。假设外层没有关联表单(也就新建一条就保存)的情况下,那么直接把row发到后台就能够保存了,之后显示就仅仅须要text而不须要value的信息,这或许就是datagrid设计的初衷吧。可是它可能没有考虑到稍复杂的关联表单的情况。比方我们这里的业务,保存到数据库肯定是在外层表单提交的时候一起保存的,所以这个row的数据我们要临时先记录下来。

怎么记录呢?在js里可能就仅仅有array这样的保存一串数据的数据类型了吧。于是创建了一个arrayrows)来保存row

问题又来了,那么js中的array怎么传到后台呢?这也是困扰了我一个下午的问题。

我先是直接用{”rows”:rows}这种格式postserver。抓了HTTP请求。实际上发的请求參数是这种{rows[0][a], rows[0][b],……rows[1][a], rows[1][b]…….}当中abrow中的字段名

看到这样的情况果断还非常开心啊,以为Spring能够自己主动绑定參数了。百度了一下于是跑到server

写下一行代码:

public void saveDispatches(@RequestParam(“rows[]”) Ddetails ddetails[])

满心以为能够直接接到数据了。结果发现接不到。又试了

public void saveDispatches(@RequestParam(“rows[][]”) Object ddetails[][])都不行

最后直接request.getParameter(“rows[0][a]”)这样倒是有了,尼玛啊,这样接參数还不得接到死啊。

 

只是这样的方式我也仅仅是试试而已。jsarray直接传递到后台肯定会有问题。

 

再一想,列表中的每一条记录最好都给一个name。然后value就是这条rowjson类型)。比方说类似row1:””, row2:””, row3:””

想了一下认为还是不可行。由于參数的数量不确定,后台没有一个好的方法来接參数

 

后来从form传数据得到灵感,能够用同样的名字,然后用分隔符分开,后台能够得到一个数组。可是这样事实上后台得到的就是json的数据,没办法直接绑定參数到实体了。

可是这里另一个问题。我发现json在作为array的一个元素的时候,HTTP请求过去的时候,不会自己转换成字符串,而是会以rows[a],row[b] 这样的形式发送

这并非我们想要的,于是先要把json转换成string类型:

$.extend({
	toStr:function(json){
		var str = "";
		$.each(json, function(k,v){
			str += "," + k + ':"' + v + '"';
		});
		str = "{" + str.substring(1) + "}";
		return str;
	}
})

接下来表单提交的时候。就能够这么传数据:

	$("#dispatches_form").form('submit', {
		url:'repairs/saveDispatches',
	    onSubmit: function(param){
	    	param.ddetails = jsonArr.join('@');
	    },
	    success:function(data){
	        $.messager.progress('close');
	        $("#repairsPaper").dialog('close');
	    }				
	});

这样后台就能接到json格式的字符串了,再通过“@”分开成一条条json记录,接下来

就须要我们手动绑定到实体了,为了防止还有这样的需求。于是写了一个还算通用的将json和实体绑定的方法:

	public static <T> T transferFromJsonObject(Class<T> clazz,
			JSONObject jsonObject) {
		T t = null;
		try {
			t = clazz.newInstance();
			Field[] fields = clazz.getDeclaredFields();
			for (Field field : fields) {
				field.setAccessible(true);
				Object value;
				if ((value = jsonObject.get(field.getName())) != null
						&& StringUtils.isNotEmpty((String) value)) {
					if (field.getType() == Date.class) {
						SimpleDateFormat format = new SimpleDateFormat(
								"yyyy-MM-dd");
						value = format.parse((String) value);
					} else if (field.getType() == Integer.class) {
						value = Integer.parseInt((String) value);
					} else if (field.getType() == Double.class) {
						value = Double.parseDouble((String) value);
					}
					field.set(t, value);
				}
			}
		} catch (Exception e) {
			e.printStackTrace();
		}
		return t;
	}

至此。虽然过程曲折相对,但最终得到~

版权声明:本文博客原创文章,博客,未经同意,不得转载。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/117564.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号