ajax从JSP传递对象数组到后台的方法

今日工作中遇到了需要从JSP传递对象数组到后台的需求，网上辗转找了很多资料，终于解决。苦于网上很多资料不全，故记录下详细解决过程。如下：

JSP：

function addAccount(){
		debugger;
		var html = '';
		var ary = $("#match_account").find("p");
		var _list = new Array();

		if(ary.length){
			for(var i = 0,len = ary.length;i < len;i ++){
				var account = new Object();
				html += '<li class="fl mb8" data-id="'+ary[i].id+'" data-sort="0">';
				html += '<span class="mr8 display-ib" style="background:#eee;padding:0px 5px 6px 5px">';
				html += '<span data-id="">'+ary[i].innerHTML+'</span>';
				html += '<a onclick="deleteAccount(this);" href="javascript:;" rel="external nofollow" class="js-btn-remove-tag ml4" style="vertical-align:5px;color:#999;" title="删除">x</a>';
				html += '</span>';
				html += '</li>';

				account.accountId = ary[i].id;
				account.account = ary[i].innerHTML;
				_list.push(account);
			}

			$.ajax({
				type: "post",
				url: "${ctx}/companyAccount/addContributeAccounts",
				data : {list : JSON.stringify(_list)},
				async: false,
				success: function (json) {
					var result = json.obj.result;
					if(result != 1){
						layer.error('添加账号失败.');
					}
				}
			});
		}

		$("#contribute_account").append(html);
	}

关键之处有三：

一，定义数组

var _list = new Array();

二，定义对象，并迭代添加对象属性，最后push进数组

var account = new Object();
account.accountId = ary[i].id;
account.account = ary[i].innerHTML;
_list.push(account);

三，提交时转换数组对象

data : {list : JSON.stringify(_list)}

后台java：

/**
	 * 添加投稿账号
	 */
	@RequestMapping(value = "addContributeAccounts")
	@ResponseBody
	public JsonResult addContributeAccounts(String list) {
		JSONArray ary = JSONArray.fromObject(list);
		if(ary != null && ary.size() > 0){
			List<RegionContributeAccount> accountList = (List<RegionContributeAccount>)JSONArray.toCollection(ary,
					RegionContributeAccount.class);
			for(RegionContributeAccount account : accountList){
				companyAccountService.insertContributeAccount(account);
			}
		}

		Map<String, Object> obj = new HashMap<String, Object>();

		obj.put("result", 1);

		return JsonResult.success(obj);
	}

后台要点有二，

一，转换ary数组

JSONArray ary = JSONArray.fromObject(list);

二，数组转自定义java对象

List<RegionContributeAccount> accountList = (List<RegionContributeAccount>)JSONArray.toCollection(ary,
  RegionContributeAccount.class);

自此，便打通前后端任督二脉。

以上这篇ajax从JSP传递对象数组到后台的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • ajax 提交数据到后台jsp页面及页面跳转问题

    ajax 提交数据到后台jsp页面及页面跳转问题 我logincheck.jsp页面取传参数代码: String user=request.getParameter("user1"); String pwd=request.getParameter("pwd1"); login.jsp input 取2参数何用ajax 传给logincheck.jsp $.ajax({ type : "POST", url : baseUrl+"m/m

  • jquery ajax 向后台传递数组参数示例

    需求: 在JS中向后台传递数组参数 分析: JS中的数组是弱类型的可以放任何类型(对象.基本类型),但是如果数组中放的是对象类型,传递到后台是显示的只能是对象字符串--[object Object],原因如下: 在后台接收的时候,只能用request来接收,request.getParameterValues()方法返回的是一个String[],所以,应该是在前台传输的时候调用了对象的toString()方法,那么如果依然想传递对象怎么办?凉拌! 但是可以使用JSON字符串来实现,在后台把JSO

  • 以JSON形式将JS中Array对象数组传至后台的方法

    以JSON形式将JS中Array对象数组传至后台的方法

    业务是需要将前台jQuery easyUI DataGrid列表中所选的若干行的数据传到后台进行update操作 通常情况下我们会获取所选取行对象的ID,通过循环及简单封装拼凑成一个长String传送过去,并在Service层解释再通过findByID获取实例并update 但今次我们需要将整个对象群完整的传输至后台 其结构如下 选用谷歌的GSON插件及json2.js搭配使用 前台代码如下,简洁起见已去除部分简单验证代码: 复制代码 代码如下: var rows = $('#dg1').dat

  • 使用js声明数组,对象在jsp页面中(获得ajax得到json数据)

    1.在jsp页面的js中可以用jsp标签 var patientInfoList={patientId:"${session.patientId}"};var docDepList=[],noTypeMap=["","普通号","主治医生号","副主任医师号","主任医师号"]; <c:forEach varStatus="idx" var="list

  • ajax从JSP传递对象数组到后台的方法

    今日工作中遇到了需要从JSP传递对象数组到后台的需求,网上辗转找了很多资料,终于解决.苦于网上很多资料不全,故记录下详细解决过程.如下: JSP: function addAccount(){ debugger; var html = ''; var ary = $("#match_account").find("p"); var _list = new Array(); if(ary.length){ for(var i = 0,len = ary.length;

  • jquery用get实现ajax在ie里面刷新不进入后台解决方法

    复制代码 代码如下: function verify() { var jqueryObj = $("#username"); var username = jqueryObj.val(); //var url = "servlet/UserInfo?username=" + encodeURI(encodeURI(username)); var url = "servlet/UserInfo?username=" +username; //注意这

  • AJAX和JSP混合使用方法实例

    AJAX和JSP混合使用方法实例

    首先要知道AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. 什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术.AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分

  • AJAX和JSP实现的基于WEB的文件上传的进度控制代码第1/2页

    AJAX和JSP实现的基于WEB的文件上传的进度控制代码第1/2页

    1.引言 2.实现代码 2.1.服务器端代码 2.1.1. 文件上传状态类(FileUploadStatus) 2.1.2. 文件上传状态侦听类(FileUploadListener) 2.1.3. 后台服务类(BackGroundService) 2.1.4. 文件上传状态控制类(BeanControler) 2.2. 客户端代码 2.2.1. AjaxWrapper.js 2.2.2. fileUpload.html 2.2.3. result.jsp 2.2.4. fileUpload.c

  • Javascript基于AJAX回调函数传递参数实例分析

    本文实例讲述了Javascript基于AJAX回调函数传递参数的方法.分享给大家供大家参考,具体如下: 前面介绍了<javascript实现html页面之间参数传递的四种方法>,这里针对ajax参数传递做一分析. 在Javascript 中,特别是在AJAX中,回调函数常常是一个函数名,没有地方放入参数,如下面的AJAX代码,在成功后将调用回调函数callback,但callback是有参数的,如何把参数传进来呢? var callback = function(p1){ //do somet

  • jQuery通过ajax请求php遍历json数组到table中的代码(推荐)

    html代码(test.html),js在html底部 具体代码如下所示: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>test-jquery-ajax-list</title> </head> <body> <div class="main">

  • Bootstrap进度条与AJAX后端数据传递结合使用实例详解

    很多时候,我们执行页面上某个URL请求的时候,需要有等待的时间.如果是直接的页面跳转,浏览器会有缓冲进度展示,但是如果是AJAX,我觉得应该自己加上进度条,等待数据全部接收到之后,进度条消失,展示页面. 在Yii框架里面使用了AJAX后,觉得前后端的数据交互变得方便多了. 下面直接贴代码啦 控制器Controller public function actionTest(){ if(isset($_POST["number"])){ $html = "success"

  • jQuery Tips 为AJAX回调函数传递额外参数的方法

    具体到这个例子,我们希望button1和button2点击之后,用AJAX的方式取example.html的内容,然后动态更新页面的id=callbackdemo3的div HTML如下: 复制代码 代码如下: <div id="callbackdemo1"> <button id="button1">ajax load1</button><br/> </div> <div id="call

  • JSP页面中超链接传递中文参数出现乱码问题解决方法

    本文实例讲述了JSP页面中超链接传递中文参数出现乱码问题解决方法.分享给大家供大家参考,具体如下: 这里分析超链接传递中文参数,在接受页面中出现乱码问题的解决方法. 解决方法: 在接受页面里可以如下处理, 复制代码 代码如下: <%=new String(request.getParameter("变量名字").getBytes("ISO-8859-1")) %> 注意这里用的是 new String() 创建一个新的字符串 例题: 页面一: <h

  • jQuery中通过ajax调用webservice传递数组参数的问题实例详解

    下面通过实例给大家说明比较直观些,更方便大家了解. 本人的项目中通过jquery.ajax调用webservice. 客户端代码如下: $.ajax({ url: "test/xxx.asmx", type: 'POST', dataType: 'xml', timeout: , data: { name: "zhangsan", tags: ["aa", "bb", "cc"] }, error: fun

随机推荐