一、背景简介
最近小编在做项目的时候,遇到了这样一个需求:如下图所示,表头中的"一般"和"优秀"是动态添加的,添加上对应的票数之后,选中多行,单击保存,将动态添加的列数据转换成行保存到数据库中
表结构:如下图所示
项目框架:MVC+WCF+EF
兼容浏览器:Google
二、解决思路一
首先取表头信息,然后取改变的行数据,通过表头ID对应的取数据信息,组合到一起,然后一起提交到controller中
HTML代码
<span style="font-family:KaiTi_GB2312;font-size:18px;">- <div title="未录入单位" style="padding: 10px"> <table id="dgno" class="easyui-datagrid" style="width: 1070px; height: auto" data-options=" iconCls: 'icon-edit', toolbar: '#toolbarno', rownumbers:true, url: 'datagrid_data1.json', method:'get', onClickCell: onClickCell"> </table> <div id="toolbarno"> <a href="javascript:void(0)" id="saveButton" class="easyui-linkbutton" data-options="iconCls:'icon-save',plain:true" οnclick="AddAllData()">保存</a> <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-undo',plain:true" οnclick="reject()">撤销</a> </div> </div> -</span>
js代码
<span style="font-family:KaiTi_GB2312;font-size:18px;">- //批量保存表格中填入数据的行值-马康-2016-4-10 19:26:01 function AddAllData() { //获取选中行的数据 var selectRows = $("#dgno").datagrid("getChanges"); //获取表头数据 var fields = $("#dgno").datagrid("getColumnFields"); //获取考核年份 var CheckYear1 = $('#CheckYear').combobox("getValue"); //如果没有选中行的话,提示信息 if (selectRows.length < 1) { $.messager.alert("提示消息", "请选择要保存的记录!", "info"); return; } //定义一个承接对象的ID var CityObjectID = ""; //定义一个承接档次的ID var TargetLevelID = ""; //定义一个承接票数的值的变量 var Votes = ""; //定义一个承接年份的变量 var CheckYear = ""; //定义一个承接备注的变量 var Remark = ""; //循环将数据添加到对应的列中 for (var i = 0; i < selectRows.length; i++) { //通过动态的表头判断循环的次数 for (var p = 5; p < fields.length; p++) { //取固定列的数据 CityObjectID += selectRows[i].CityObjectID + ","; //对象ID TargetLevelID += fields[p - 1] + ","; //档次ID //通过这样的方式取动态添加的列的数据,票数 //将SelectRows赋值给变量a var a = selectRows[i]; //循环a的值,取 for (s in a) { if (s == fields[p - 1]) { //将对应的票数赋值给votes Votes += a[s] + ","; } } CheckYear += CheckYear1 + ","; //年份 Remark += selectRows[i].Remark + ","; //备注 } } //因为是批量保存,所以需要循环切割所有的数据 CityObjectID = CityObjectID.substr(0, CityObjectID.length - 1); //对象ID TargetLevelID = TargetLevelID.substr(0, TargetLevelID.length - 1);//档次ID Votes = Votes.substr(0, Votes.length - 1); //票数 CheckYear = CheckYear.substr(0, CheckYear.length - 1); //年份 Remark = Remark.substr(0, Remark.length - 1); //备注 //post将获取到的指标ID一起传递到controller中 $.post('/CityQualitativeResult/AddCityQualitativeResult?CityObjectID=' + CityObjectID + '&TargetLevelID=' + TargetLevelID + '&Votes=' + Votes + '&CheckYear=' + CheckYear + '&Remark=' + Remark, function (jsonObj) { //判断返回值 if (jsonObj = "true") { //成功提示信息 $.messager.alert('提示', '保存成功!'); //保存成功后刷新页面 $("#Targetdg").datagrid("reload"); //解决保存后全选问题 $('#Targetdg').datagrid('clearSelections'); } else { //失败提示信息 $.messager.alert('提示信息', '保存失败,请联系管理员!', 'warning'); } }); } -</span>
controller代码
<span style="font-family:KaiTi_GB2312;font-size:18px;">- #region AddQualitativeTarget 添加定性指标-马康-2016-3-10 1:49:45 /// <summary> /// 添加定性指标-马康-2016-3-10 1:49:45 /// </summary> /// <returns></returns> public bool AddCityQualitativeResult() { bool AddOk = false; try { //实例化返回数据的载体 List<AllQualitativeResultInputViewModel> ListAllQualitativeResultInputVM = new List<AllQualitativeResultInputViewModel>(); //获取县市区对象ID var CityObjectID1 = Request["CityObjectID"]; //通过分割方式获取县市区对象ID string[] CityObjectID2 = CityObjectID1.Split(','); //获取指标档次ID var TargetLevelID1 = Request["TargetLevelID"]; //获取指标档次ID string[] TargetLevelID2 = TargetLevelID1.Split(','); //获取档次对应的分数 var Votes1 = Request["Votes"]; //获取档次对应的分数 string[] Votes2 = Votes1.Split(','); //获取年份 var CheckYear1 = Request["CheckYear"]; //获取年份 string[] CheckYear2 = CheckYear1.Split(','); //获取备注 var Remark1 = Request["Remark"]; //获取备注 string[] Remark2 = Remark1.Split(','); //通过循环将传过来的值保存到实例化的List的ViewModel中 for (int i = 0; i < CityObjectID2.Length; i++) { Guid CityQualitativeResultID = System.Guid.NewGuid(); //县市区对象ID Guid CityObjectID = new Guid(CityObjectID2[i]); //获取指标档次ID Guid TargetLevelID = new Guid(TargetLevelID2[i]); //获取档次对应的分数 int Votes = int.Parse(Votes2[i]); //获取年份 int CheckYear = int.Parse(CheckYear2[i]); //获取备注 string Remark = Remark2[i]; //向实体中添加数据 AllQualitativeResultInputViewModel AllQualitativeResultInputVM = new AllQualitativeResultInputViewModel() { CityQualitativeResultID = CityQualitativeResultID, CityObjectID = CityObjectID, QualitativeLevelID = TargetLevelID, Votes = Votes, CheckYear = CheckYear, Remarks = Remark, }; //将实体赋值给List ListAllQualitativeResultInputVM.Add(AllQualitativeResultInputVM); } //调用服务端添加的方法 AddOk = ICityQualitativeResult.AddCityQualitativeResult(ListAllQualitativeResultInputVM); return AddOk; } catch (Exception ex) { throw ex; } } #endregion -</span>
三、解决思路二
可以将动态数据用特殊符号区分开,然后一起存到数据库表的票数列(Votes)中,这样的思路避免了对象,年份,备注这些固定列数据的冗余问题。
四、总结感受
面对一个新需求,首先应该理解它,其次先去想可以实现的思路,对比之后取一个好的然后去实现,再学习另外实现思路与之不同的技术点,这样才能够使我们的思路更加顺畅。