Form表单传递List数组属性到后台对象中

您所在的位置：网站首页 › 表单传递 › Form表单传递List数组属性到后台对象中

Form表单传递List数组属性到后台对象中

2024-07-09 16:43| 来源: 网络整理| 查看: 265

第一层属性的List

后台有一个对象 User ，结构如下：

public class User{ private String username; private List photo; ..get ....set..... } public class PhotoDo{ private String id; private String name; ...get...set... }

Controller中接受方法 getUser

@reqeustMapping("/getUser") public void getUser(User user){ ...实现方法... }

前台Form这么写：

第二层属性的List

如果List属性不是在User属性的第一层，而是在第二层，则需要处理一下。

后台有一个对象 User ，结构如下：

public class User{ private String username; private Address address; ..get ....set..... } public class Address{ private List photo; ..get ....set..... } public class PhotoDo{ private String id; private String name; ...get...set... }

Controller中接受方法 getUser

@reqeustMapping("/getUser") public void getUser(User user){ ...实现方法... }

前台Form这么写：

Js中需要作处理:

$('button.save').on('click', function () { debugger; var data = $('#user').formGet(); var photos = new Array(); for (var i in data.address) { photos.push(data.address[i]); } data.photos= photos; $.ajax({ type: "POST", url: "/user/save", contentType: "application/json", data: JSON.stringify(data), success: function (result) { console.log(result); if (!result.code) { $('#mutation').formSet(data); location.href = '/user' } else { alert(result.msg); } }, error: function () { alert("出错了，请稍后重试"); } }); }); 其中使用的几个函数为: var _fnObjectGetPropertyChainValue = function(obj, propertyChain) { /* 获取属性链的值 */ if (!obj) return; if (!propertyChain) return obj; var property, chains = propertyChain.split('.'), i = 0, len = chains.length; for (; (property = chains[i]) && i < len - 1; i++) { if (!obj[property]) return; obj = obj[property]; } return obj[property]; }, _fnObjectSetPropertyChainValue = function(obj, propertyChain, value, allowMulti) { /* 设置属性链的值 */ if (!obj || !propertyChain) return; var property, chainObj = obj, chains = propertyChain.split('.'), i = 0, len = chains.length; for (; (property = chains[i]) && i < len - 1; i++) { if (!chainObj[property]) { chainObj[property] = {}; } chainObj = chainObj[property]; } // 改进版：checkbox的多选可以组合为数组 if (!allowMulti || chainObj[property] === undefined) { chainObj[property] = value; } else { var pv = chainObj[property]; if ($.isArray(pv)) { pv.push(value); } else { chainObj[property] = [pv, value]; } } return obj; }; /** * jQuery form 扩展获取数据 */ $.fn.formGet = function(opts) { opts = $.extend({}, opts); var data = {}, els = opts.formGroup ? this.find('[form-group="' + opts.formGroup + '"]') : this.find('[name]'); if (!els || !els.length) { return data; } var fnSetValue = (function(emptyToNull) { return emptyToNull ? function(obj, propertyChain, value, allowMulti) { value !== '' && _fnObjectSetPropertyChainValue(obj, propertyChain, value, allowMulti) } : _fnObjectSetPropertyChainValue })(opts.emptyToNull); els.each(function() { var $this = $(this), type = $this.attr('type'), name = $this.attr('name'), // 可能为属性链 tag = this.tagName.toLowerCase(); if (tag == 'input') { if (type == 'checkbox') { var v = $(this).val(); if (v == 'on' || !v) { fnSetValue(data, name, $(this).prop('checked')); } else { $(this).prop('checked') && fnSetValue(data, name, v, true); } } else if (type == 'radio') { this.checked && fnSetValue(data, name, $this.val()); } else { fnSetValue(data, name, $this.val()); } } else if ('|select|textarea|'.indexOf('|' + tag + '|') > -1) { fnSetValue(data, name, $this.val()); } else { fnSetValue(data, name, $.trim($this.text())); } }); return data; }; /** * jQuery form 扩展绑定数据 * */ $.fn.formSet = function(data, formGroup) { var els = formGroup ? this.find('[form-group="' + formGroup + '"]') : this.find('[name]'); if (!els || !els.length) { return this; } els.each(function() { var $this = $(this), type = $this.attr('type'), name = $this.attr('name'), tag = this.tagName.toLowerCase(); var value = _fnObjectGetPropertyChainValue(data, name); if (tag == 'input') { if (type == 'checkbox') { var v = $(this).val(); if (v == 'on' || !v) { this.checked = value ? 'checked' : ''; } else { this.checked = $.isArray(value) && value.indexOf(v) > -1 ? 'checked' : '' } } else if (type == 'radio') { this.checked = $this.val() == String(value) ? 'checked' : ''; } else { $this.val(value); } } else if ('|select|textarea|'.indexOf('|' + tag + '|') > -1) { $this.val(value); } else { $this.html(value); } }); return this;

};

【本文地址】

Form表单传递List数组属性到后台对象中

Form表单传递List数组属性到后台对象中

今日新闻

推荐新闻