实现暂存功能

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/li4562258fj155/article/details/73993238

项目测试中客户觉得单据过于复杂而且保存验证条件过多,希望能够录入到一半的单据先暂时保存起来不做任何验证,等需要时可以将曾经暂存的单据拿出来继续执行。

实现思路:

暂存:用户新增单据时点击“暂存”,使用jquery获取单据上用户录入的所有元素信息,拼接成json字符串和单据类型、登录用户等信息保存到数据库中。

引用暂存:用户新增单据时点击“引用暂存”,根据登录用户和单据类型查询暂存单据列表。用户选择其中一个暂存单据,使用ajax获取选中暂存单据json数据,解析数据并覆盖当前单据所有元素。


具体代码:

暂存单据

function saveTemMemory(){
	var jsonArr = [];
	//获取页面中所有元素的信息,将数据拼接为jsonArr
	$("input,select,textarea").each(function(){
		var map = {};
		var id = $(this).attr("id");//元素id
		var name = $(this).attr("name");//元素名称
		var tagName = $(this)[0].tagName.toLowerCase();//标签名称
		var type = $(this).attr("type");//元素type
		var val = $(this).val();//value
		
		if (type == "file") {//文件标签
			return true;
		}
		if (type == "radio") {//单选框
			//当此选项未选中时跳过
			if (!$("input:radio[name='" + name + "'][value='" + val + "']").attr("checked")) {
				return true;
			}
		}
		if (type == "checkbox") {//复选选框
			//当此选项未选中时跳过
			if (!$("input:checkbox[name='" + name + "'][value='" + val + "']").attr("checked")) {
				return true;
			}
		}
		
		map.id = id;
		map.name = name;
		map.tagName = tagName;
		map.type = type;
		map.val = val;
		
		jsonArr.push(map);
	});
	//转换并保存json数据
        //这里就没必要说了吧?
        .....
}

引用暂存单据

function quoteTemMemory(tmId){
	//查询暂存单据
	$.ajax({
		async : false,//异步
		cache : false,//缓存
		type : "POST",
		url : "获取暂存单据数据的地址",
		data : {
			tmId : tmId//暂存单据id
		},
		dataType : "JSON",
		error : function(){
			alert("请求失败!");
		},
		success : function(data){
			if (data.result) {//成功
				//使用暂存单据覆盖现有单据数据
				var jsonArr = new Function("return" + data.jsonStr)();//解析json
				//遍历json对象
				for ( var i in jsonArr) {
					var jsonObj = jsonArr[i];
					var id = jsonObj.id == undefined ? "" : jsonObj.id.replace("~", "\\~");//元素id
					var name = jsonObj.name;//元素名称
					var tagName = jsonObj.tagName;//标签名称
					var type = jsonObj.type;//元素type
					var val = jsonObj.val;//value
					
					if (tagName == "input") {//input
						if (type == "radio") {//radio
							$("input:radio[name='" + name + "'][value='" + val + "']").attr("checked", "checked");
						} else if (type == "checkbox") {//checkbox
							$("input:checkbox[name='" + name + "'][value='" + val + "']").attr("checked", "checked");
						} else {
							$("#"+id).val(val);//赋值
						}
					} else {
						$("#"+id).val(val);//赋值
					}
				}
			}
		}
	});
}

后端新增和查询暂存单据应该就没有必要说了吧?!



阅读更多
换一批

没有更多推荐了,返回首页