serializeObject 的应用
function sendForm() {
var invOrderModelWrapper = {};
// 头
var objHeader = $('#invOrderForm').serializeObject();
invOrderModelWrapper.invOrderModel = objHeader;
// 明细
var objDetail = {
id: "",
invId: "",
skuId: "", // sku
skuCode: "",
factoryId: "",
price: "", //
stockNum: "", //库存数量
stockAmount: "", // 总成本
lossNum: "",//报损量
lossAmount: "", //报
invNum: "", //盘点量
invAmount: "", //盘点
invLossNum: "", //盘点报
invLossAmount: "", //
remarks: "" //备注
}
var objArrDetail = constructObjectFromTable(objDetail, $('#invOrderDetailForm .table-row-cell'));
if (objArrDetail.length == 0) {
$.alert({
title: '提示',
content: "盘点明细不能为空!",
buttons: {"好的": {btnClass: 'btn-blue'}}
});
return false;
}
invOrderModelWrapper.invOrderDetailModels = objArrDetail;
$.ajax({
type: "POST",
dataType: "json",
cache: false,
contentType: "application/json; charset=utf-8",
url: "/storage/invOrder/saveInvOrderModel",
data: JSON.stringify(invOrderModelWrapper),
success: function (data) {
if (data.code) {
$.alert({
title: '提示',
content: "操作成功!",
buttons: {
"好的": {
btnClass: 'btn-blue',
action: function () {
var invIdTemp = $('#invId').val();
var invTypeTemp = $('#invType').val();
window.location.href = "/storage/invOrder/viewInvOrder?id=" + invIdTemp + "&invType=" + invTypeTemp + "&viewTypeTo=view&modelType=guanli";
}
}
}
});
return;
} else {
$.alert({
title: '提示',
content: "操作失败!",
buttons: {"好的": {btnClass: 'btn-blue'}}
});
}
}
})
}
function save() {
sendForm("");
<section class="content">
<div class="row box box-primary" id="viewDiv">
<div class="col-md-16">
<div class="box-body">
<input type="hidden" id="info" value="${info!}">
<form id="invOrderForm" class="form-horizontal"
data-validator-option="{theme:'bootstrap', timely:2, stopOnError:true}" method="post">
<div class="form-inline">
<input type="hidden" id="invId" name="id" value="${invOrderModel.id}"/>
<input type="hidden" id="invType" name="invType"
value="${invOrderModel.invType}"
placeholder="标记是基础盘点还是库存盘点"/>
<input type="hidden" id="creator" name="creator" value="${invOrderModel.creator}"
placeholder="登陆人">
<input type="hidden" id="auditState" name="auditState" value="${invOrderModel.auditState}"
placeholder="审核状态 0:待提交 1:待审核 2:已审核 3:已驳回"> <label for="invCode">盘点单编码:</label>
<input type="text" id="invCode" name="invCode" class="form-control"
value="${(invOrderModel.invCode)!}" readonly="true"> <label for="storageName">盘点仓库:</label>
<input type="hidden" id="storageId" name="storageId" class="form-control"
value="${(invOrderModel.storageId)!}" readonly="true">
<input type="text" id="storageName" name="storageName" class="form-control"
value="${(invOrderModel.storageName)!}" readonly="true">
<!--添加SKU-->
<a class="btn btn-primary pull-right" href="javascript:addSKU();"><i
class="fa fa-plus"></i> 添加SKU
</a>
</div>
</form>
<div class="form-group">
<div class="box-body table-responsive no-padding col-sm-16">
<form id="invOrderDetailForm" class="form-horizontal"
data-validator-option="{theme:'bootstrap', timely:2, stopOnError:true}" method="post">
<table class="table table-hover tdnowrap">
<thead>
<tr>
<th>系列</th>
<th>产品型号</th>
<th>尺寸</th>
<th>材质</th>
<th>颜色</th>
<th>结构</th>
<th>配套件1</th>
<th>配套件2</th> <th>sku码</th>
<th>生产部</th>
<th>单价</th>
<th>库存量</th>
<th>总成本(元)</th>
<th>报损量</th>
<th>总报损(元)</th>
<th>盘点量</th>
<th>盘点额(元)</th>
<th>盘点报损量</th>
<th>盘点报损额(元)</th>
<th>备注</th>
<th>删除</th>
</tr>
</thead>
<tbody>
<#list invOrderDetailForm as detail>
<tr id="tr_${(detail.skuId)!}" class="table-row-cell">
// <td><input id="gvDataList_CheckAll" type="checkbox" name="gvData"/></td>
<td>${detail.seriesName}</td>
<td>${detail.productModel}</td>
<td>${detail.size}</td>
<td>${detail.material}</td>
<td>${detail.color}</td>
<td>${detail.structure}</td>
<td>${detail.suite1}</td>
<td>${detail.suite2}</td>
<td>
<input type="hidden" name="id" value="${(detail.id)!}"/>
<input type="hidden" id="skuId" name="skuId" value="${(detail.skuId)!}"/>
<input type="hidden" name="invId"
value="${invOrderModel.id}"/>
<input type="text" id="skuCode" name="skuCode" readonly
value="${(detail.skuCode)!}"/> </td>
<td>
<input type="hidden" id="factoryId" name="factoryId"
value="${(detail.factoryId)!}"/>
<input type="text" id="factoryName" name="factoryName" readonly
value="${(detail.factoryName)!}"/>
</td>
<td>
<input type="text" id="price_${(detail.skuId)}" name="price" readonly
value="${(detail.price)!}"/> </td>
<td>
<input type="text" id="stockNum" name="stockNum" readonly
value="${(detail.stockNum)!}" placeholder="库存量"/>
</td>
<td>
<input type="text" id="stockAmount" name="stockAmount" readonly
value="${(detail.stockAmount)!}" placeholder="总成本(元)"/>
</td>
<td>
<input type="text" id="lossNum" name="lossNum" readonly
value="${(detail.lossNum)!}" placeholder="报损量"/>
</td>
<td>
<input type="text" id="lossAmount" name="lossAmount" readonly
value="${(detail.lossAmount)!}" placeholder="总报损(元)"/>
</td>
<td>
<input type="text" id="invNum" name="invNum" class="form-control"
value="${(detail.invNum)!}" placeholder="盘点量"
onblur="numChange(this.value,'${(detail.skuId)}','#invAmount_${(detail.skuId)}_${(detail.factoryId)}')"/>
</td>
<td>
<input type="text" id="invAmount_${(detail.skuId)}_${(detail.factoryId)}"
style="width: 100px;"
name="invAmount"
readonly
value="${(detail.invAmount)}"/>
</td>
<td>
<input type="text" id="invLossNum"
name="invLossNum"
value="${(detail.invLossNum)}" class="form-control"
placeholder="盘点报损量"
onblur="numChange(this.value,'${(detail.skuId)}','#invLossAmount_${(detail.skuId)}_${(detail.factoryId)}')"/> </td>
<td>
<input type="text"
id="invLossAmount_${(detail.skuId)}_${(detail.factoryId)}"
name="invLossAmount" readonly style="width: 100px;"
value="${(detail.invLossAmount)}"
placeholder="盘点报损量金额"> </td>
<td>
<input type="text" id="remarks" class="form-control" style="width:200px;"
name="remarks"
placeholder="备注" value="${(detail.remarks)}">
</td>
<td><input type="button" onclick="$('#tr_${(detail.skuId)}').remove()"
value="删除"></td>
</tr>
</#list>
</tbody>
<tbody id="invOrderDetailList"> </tbody>
</table>
</form>
</div><!-- /.box-body -->
</div> <div class="form-group">
<label class="col-sm-4 control-label"> </label>
<div class="col-sm-6">
<input type="button" id="save_btn" onclick="save()" class="btn btn-primary" value="保存">
<input type="button" id="submitAudit_btn" onclick="submitAudit()" class="btn btn-primary"
value="提交审核">
<a class="btn btn-danger" href="/storage/invOrder/list/1"> 返回</a>
</div>
</div>
</div>
</div><!--/.col (left) -->
</div>
</section><!-- /.content -->
//表单封装json
function constructObjectFromTable(object, $object) {
var javaObjArray = []; $object.each(function(i) {
// var $ck = $(this).find('input[name^=gvdata]');
// if($ck.length != 0){
// if(!$ck.attr('checked')){
// return true;
// }
// }
var javaObj = {}; for (var p in object) {
var $val = $(this).find('input[name="'+p+'"]');
if ($val.length === 0) {
javaObj[p] = $(this).find('select[name="'+p+'"]').val();
} else {
javaObj[p] = $val.val();
}
} javaObjArray.push(javaObj);
}); return javaObjArray;
}
/**
* 保存/提交审核
*
* @param invOrderModelWrapper
* @return
*/
@RequestMapping(value = "/saveInvOrderModel")
@ResponseBody
public Map saveInvOrderModel(@RequestBody InvOrderModelWrapper invOrderModelWrapper) { boolean code = invOrderDetailModelService.saveInvOrderModelWrapper(invOrderModelWrapper);
Map returnMap = new HashMap();
returnMap.put("code", code);
return returnMap;
}
/**
* 保存头和明细/提交审核
*
* @param invOrderModelWrapper
*/
@Override
public boolean saveInvOrderModelWrapper(InvOrderModelWrapper invOrderModelWrapper) {
boolean retflag = false;
// 头信息
InvOrderModel invOrderModel = invOrderModelWrapper.getInvOrderModel();
Integer counts = invOrderModelMapper.searchCountInvOrder(invOrderModel.getId());
if (counts > 0) { // 表中已经存在,说明是 编辑
retflag = this.doEdit(invOrderModelWrapper);
} else { // 表中不存在,是新增
retflag = this.doSave(invOrderModelWrapper);
}
return retflag;
} importorg.codehaus.jackson.annotate.JsonIgnoreProperties; import java.util.List;
@JsonIgnoreProperties(ignoreUnknown = true)
public class InvOrderModelWrapper {
private InvOrderModel invOrderModel;
private List<InvOrderDetailModel> invOrderDetailModels; public InvOrderModel getInvOrderModel() {
return invOrderModel;
} public void setInvOrderModel(InvOrderModel invOrderModel) {
this.invOrderModel = invOrderModel;
} public List<InvOrderDetailModel> getInvOrderDetailModels() {
return invOrderDetailModels;
} public void setInvOrderDetailModels(List<InvOrderDetailModel> invOrderDetailModels) {
this.invOrderDetailModels = invOrderDetailModels;
}
}
<script src="/plugins/jQuery/serializeObject.js"></script>
/*
* .serializeObject (c) Dan Heberden
* danheberden.com
*
* Gives you a pretty object for your form elements
*/
(function ($) {
$.fn.serializeObject = function () {
if (!this.length) {
return false;
} var $el = this,
data = {},
lookup = data; //current reference of data $el.find(':input[type!="checkbox"][type!="radio"], input:checked').each(function () {
// data[a][b] becomes [ data, a, b ]
var named = this.name.replace(/([^]+)?\]/g, ',$1').split(','),
cap = named.length - 1,
i = 0; for (; i < cap; i++) {
// move down the tree - create objects or array if necessary
lookup = lookup[named[i]] = lookup[named[i]] ||
( named[i + 1] == "" ? [] : {} );
} // at the end, psuh or assign the value
if (lookup.length != undefined) {
lookup.push($(this).val());
} else {
lookup[named[cap]] = $(this).val();
} // assign the reference back to root
lookup = data;
}); return data;
};
})(jQuery);
serializeObject 的应用的更多相关文章
- 利用JsonConvert.SerializeObject()实现类对象的json化
现阶段的项目是采用前后端分离的思想,前端使用的是Angular.JS,后端使用ABP框架,在后端我们通过WebAPI技术来向前端提供json数据.以前是通过MVC来写前端的代码,感觉后端有点在控制前端 ...
- 将复杂form表单序列化serialize-object.js
<form class="form-horizontal" role="form" id="myform" action=" ...
- Newtonsoft.Json序列化和反序列之javascriptConvert.SerializeObject,DeserializeObject,JsonWriter,JsonReader
这里下载:http://www.newtonsoft.com/products/json/安装: 1.解压下载文件,得到Newtonsoft.Json.dll 2.在项目中添加引用.. jav ...
- jQuery - 基于serializeArray的serializeObject
将表单序列化成JSON对象,注意不管是自实现的serializeObject()还是原生的serializeArray(),所要序列化的控件都必须要有name,而不是id jQuery.prototy ...
- @Html.Raw() 与Newtonsoft.Json.JsonConvert.SerializeObject()
一.后台 ViewBag.TypeList = typeList; 二.前台C# @{ var typeListFirst = ViewBag.TypeList;} 三.前台js中 var t ...
- 自定义$('#form').serialize() var params = $('#xxx_form').serializeObject();
//注意:获取之前 $("#id").removeAttr("disabled"); $.fn.serializeObject = function () { ...
- JsonConvert.SerializeObject 空值处理
var settings = new JsonSerializerSettings() { ContractResolver= new NullToEmptyStringResolver() }; v ...
- form表单序列化serialize-object.js
<form class="form-horizontal" role="form" id="myform" action=" ...
- JsonConvert.SerializeObject() 输出josn格式 也就是序列化。
JsonConvert.SerializeObject() 输出josn格式 也就是序列化. JSON.parse 反序列化 http://www.cnblogs.com/ahlx/p/52280 ...
- Json.net的常用语句JsonConvert.SerializeObject(对象)
在ajax的已不请求中,常常返回json对象.可以利用json.net给我们提供的api达到快速开发. 例子: using System;using System.Collections;using ...
随机推荐
- NOIP模拟赛 czy的后宫3
[题目描述] 上次czy在机房妥善安排了他的后宫之后,他发现可以将他的妹子分为c种,他经常会考虑这样一个问题:在[l,r]的妹子中间,能挑选出多少不同类型的妹子呢? 注意:由于czy非常丧尸,所以他要 ...
- 对O(logN)复杂度的推导
之前一直对O(logN)这个复杂度如何推导出的存在疑问,这段时间看了一些算法相关的内容,正好看到这个问题,大略研究了一下算是基本解答了我的疑惑:现记录如下 假设有一棵高为H的满二叉树,则它的节点共有N ...
- Mac配置gdb的一些问题
1.Unable to find Mach task port for process-id 1527: (os/kern) failure (0x5). (please check gdb is ...
- MySQL8.0.12安装及配置
一.下载 下载页面http://dev.mysql.com/downloads/mysql/ 选择系统平台后,点击download(根据系统选择64或32位) 二.配置 1.下载成功后,解压安装包到要 ...
- 【windows】共享文件夹设置
控制面板\网络和 Internet\网络和共享中心\高级共享设置 在当前的域\公用\家庭网络 下文件和打印机共享开关打开 现在可以在 计算机-网络 里面看到共享的计算机啦 选中自己想要分享的文件,右键 ...
- Python3 pymsyql 连接读取数据
import pymysql conn = pymysql.connect(host='localhost', port=3306, user='root', passwd='root', db='t ...
- thinkphp5开发restful-api接口 学习笔记一
视频学习地址: http://study.163.com/course/courseMain.htm?courseId=1004171002 源码和文档(如果满意,欢迎 star): https:// ...
- Java多线程之Deque与LinkedBlockingDeque深入分析
有大小的队列就叫有界队列 如 ArrayBlockingquue, 反之是无界队列 如 LinkedBlockingDeque. 单词写错了. 是的,LinkedBlockingDeque 永远满不 ...
- Linux学习-开机过程的问题解决
忘记 root 密码的解决之道 新版的 systemd 的管理机制中,默认的 rescue 模式是无法直接取得 root 权限的喔!还是得要 使用 root 的密码才能够登入 rescure 环境.没 ...
- Linux学习-可唤醒停机期间的工作任务
什么是 anacron anacron 并不是用来取代 crontab 的,anacron 存在的目的就在于我们上头提到的,在处理非 24 小 时一直启动的 Linux 系统的 crontab 的执行 ...