`

jquery将form表单数据封装成js对象

阅读更多
// 将一个表单的数据返回成JS对象
$.fn.serializeObject = function() {
	var o = {};
	var a = this.serializeArray();
	$.each(a, function() {
		if (o[this.name]) {
			if (!o[this.name].push) {
				o[this.name] = [ o[this.name] ];
			}
			o[this.name].push(this.value || '');
		} else {
			o[this.name] = this.value || '';
		}
	});
	return o;
};

 

调用方式如下:

 

$(function() {
	$("#gridTable").jqGrid(
			{
				url : CTX+ "/transfer/querytransfer/doQueryByAjax.shtml",
				datatype : "json",
				mtype : 'POST',
				postData:$('#paramVo').serializeObject(),
				height : "auto",
				colNames : [ '提交时间', '完成时间', '交易号', '支出账户', '交易类型', '交易对方',
						'对方账号', '交易金额', '交易状态', '审核状态', '操作' ],
				colModel : [ {
					name : 'submitTime',
					width : 105,
					sorttype : "string"
				}, {
					name : 'finishTime',
					width : 105
				}, {
					name : 'txnId',
					width : 70
				}, {
					name : 'payAcct',
					width : 80,
					sorttype : "string"
				}, {
					name : 'txnCode',
					width : 50,
					formatter:function(v){
						var h="";
						if(v=="00700"){
							h="付款到银行";
						}else if(v=="00900"){
							h="付款到国付宝";
						}						
						return h;
					}
				}, {
					name : 'recName',
					width : 60
				}, {
					name : 'recAcct',
					width : 80,
					sorttype : "string"
				}, {
					name : 'txnAmt',
					width : 50
				}, {
					name : 'txnSts',
					width : 50
				}, {
					name : 'auditSts',
					width : 50
				}, {
					name : 'txnCode',
					width : 40,
					sorttype : "string",
					formatter:function(v,opts,rowObj){
						var h="啊";
						alert(dump(opts));
						alert(dump(rowObj));
						
						if(h=="00700"){
							h="批量详情";
						}
						
						return h;
					}
				} ],
				sortname : "submitTime",
				sortorder : "desc",
				viewrecords : true,
				gridview : true,
				rowNum : 10,
				rowList : [ 10, 20, 50,100],
				jsonReader : {
					repeatitems : false
				},
				pager : "#gridPager",
				caption : "付款记录列表"
			}).navGrid("#gridPager", {
		edit : false,
		add : false,
		del : false
	});

})

 

分享到:
评论

相关推荐

    jquery自动将form表单封装成json的具体实现

    // 自动将form表单封装成json }); ``` 在上述代码段中,当提交按钮(按钮的id为`butsubmit`)被点击时,表单中的数据被序列化为数组`data`,然后可以被用作AJAX请求的数据部分。 接下来,文档中还包含了一个AJAX...

    jquery表单验证插件jquery.form.js.pdf

    从技术细节上来看,`$.post`, `$.get`, `$.ajax`是jQuery中用于发起AJAX请求的函数,而jquery.form.js插件则提供了一种封装方式,使得表单的AJAX提交和数据处理更加直观和简单。 最后,文档中提到的`fieldSerialize...

    Ajax表单提交 js文件( jquery.form.js)封装好的

    Ajax表单提交,用 jquery.form.js SDK 封装好的ajaxSubmit

    jQuery实现获取form表单内容及绑定数据到form表单操作分析

    主要介绍了jQuery实现获取form表单内容及绑定数据到form表单操作,结合jQuery封装插件操作分析了jQuery针对form表单的serializeJson数据获取及setForm数据绑定相关操作技巧,需要的朋友可以参考下

    jquery.form.js(最新的)

    **jQuery.form.js** 是一个非常流行的JavaScript库,用于简化AJAX(异步JavaScript和XML)交互,特别是与HTML表单的交互。这个库是jQuery的一个扩展,它为处理表单数据提供了一种方便且强大的方式,包括无刷新的提交...

    form表单数据封装成json格式并提交给服务器的实现方法

    我们可以使用`FormData`对象来获取表单中的所有数据,然后利用`jQuery`或者原生JavaScript的`querySelectorAll`等方法遍历表单元素,将每个字段的值与对应的键组合成键值对,最后用`JSON.stringify()`函数将对象转换...

    利用JS如何获取form表单数据

    本文将详细介绍如何利用JS获取`<form>`表单数据,包括各种类型的表单元素,如输入框、下拉框、单选按钮、复选框等。 首先,表单元素通常需要设置`name`属性,因为`name`属性是后端接收数据时识别字段的关键。例如:...

    .net+ajax+jquery.form实现简单的图片批量上传源码

    然后,使用`jQuery.form`插件,我们可以监听表单的提交事件,通过AJAX方式将表单数据发送到服务器。`jQuery.form`插件提供了一个方便的方法`submit()`,可以轻松地发起异步表单提交,同时支持上传文件。在提交前,...

    jquery.form.js

    资源官网 http://plugins.jquery.com/form/ jq的表单提交插件,最大好处就是封装了文件上传的功能,可以异步上传文件

    jQuery手机端个人信息填写表单页面代码

    7. **Ajax交互**:当用户提交表单时,jQuery的Ajax功能可以实现无刷新提交,将数据异步发送到服务器。这通常涉及`$.ajax()`或`$.post()`方法,它们能封装HTTP请求,处理返回的数据,提供更好的用户体验。 8. **图片...

    jquery.serializeJSON

    `jQuery.serializeJSON` 是一个非常实用的 jQuery 插件,它扩展了 jQuery 库的功能,使得我们可以方便地将 HTML 表单数据序列化为 JSON 对象。在 Web 开发中,JSON(JavaScript Object Notation)格式已经成为数据...

    Ajax使用jQuery提交表单

    本篇文章将深入探讨如何使用jQuery来实现Ajax提交表单。 一、jQuery与Ajax基础 jQuery通过其内置的$.ajax()函数提供了对Ajax的封装。这个函数允许开发者发送异步HTTP请求,获取服务器端的数据,并在不刷新整个页面...

    jquery 表单验证(包括所有的验证)

    通过封装成 JS 类,我们可以轻松地在不同的表单中复用验证逻辑,同时还能根据项目需求进行扩展和定制,确保用户输入的数据质量。希望本文能对你的开发工作有所帮助,让你在表单验证方面更加得心应手。

    jquery 表单验证插件制作注册表单提交验证

    jQuery是一个广泛使用的JavaScript库,它简化了DOM操作,而jQuery Validate插件则是jQuery的一个扩展,专门用于实现复杂的表单验证功能。本教程将深入探讨如何使用jQuery Validate插件来制作一个用户注册表单,涵盖...

    jquery form表单序列化为对象的示例代码

    示例代码给出了一个名为`serializeObject`的函数,这个函数通过对`.serializeArray()`方法的封装,实现了将表单数据序列化为对象的需求。`.serializeArray()`方法与`.serialize()`方法类似,但它返回的不是一个字符...

    Form表单模拟美化插件.zip

    "Form表单模拟美化插件"是一个旨在提升表单视觉效果和交互体验的工具,它可以帮助开发者快速实现各种自定义样式和功能,提高表单的吸引力和可用性。 这个插件可能基于CSS(层叠样式表)、JavaScript、jQuery以及...

    jQuery form 表单验证插件(fieldValue)校验表单

    jQuery form表单验证插件提供了一套简洁、高效的解决方案,尤其是fieldValue方法,它允许开发者获取表单字段的值,以便进行验证。 首先,介绍jQuery。jQuery是一个快速、简洁的JavaScript库,它通过封装DOM操作、...

    使用jQuery.form.js/springmvc框架实现文件上传功能

    例如:jquery的ajax方法与jquery.form.js中的ajaxSubmit方法的参数,具体细节将在下一篇博客中分享。 重点: html表格三要素: action=”fileUpload/fileUpload” method=”post” enctype=”multipart/form-data”...

    jquery validation 多表单,多按钮,分组验证

    jQuery Validation插件是一个广泛使用的JavaScript库,用于在客户端进行表单验证,以确保用户输入的数据符合预设的规则。在Web开发中,它为开发者提供了便利,无需编写大量的自定义验证代码,即可实现复杂的验证逻辑...

Global site tag (gtag.js) - Google Analytics