1.前言
HTML5 storage提供了一种方式让网站能够把信息存储到你本地的计算机上，并再以后需要的时候进行获取。这个概念和cookie相似，区别是它是为了更大容量存储设计的。Cookie的大小是受限的，并且每次你请求一个新的页面的时候cookie都会被发送过去。HTML5的storage是存储在你的计算机上，网站在页面加载完毕后可以通过Javascript来获取这些数据。首先自然是检测浏览器是否支持本地存储。在HTML5中，本地存储是一个window的属性，包括localStorage和sessionStorage，从名字应该可以很清楚的辨认二者的区别，前者是一直存在本地的，后者只是伴随着session，窗口一旦关闭就没了。二者用法完全相同，这里以localStorage为例。
if(window.localStorage){
alert('支持localStorage');
}else{
alert('不支持localStorage');
}
2.基本用法
存储数据的方法就是直接给window.localStorage添加一个属性，例如：window.localStorage.a 或者 window.localStorage["a"]。它的读取、写、删除操作方法很简单，是以键值对的方式存在的，如下：
localStorage.name = "kobi";//设置name为"kobi"
localStorage["name"] = "koko";//设置name为"koko"，覆盖上面的值
localStorage.setItem("age","18");//设置age为"18"
var a1 = localStorage["name"];//获取name的值
var a2 = localStorage.age;//获取age的值
var b = localStorage.getItem("name");//获取name的值
localStorage.removeItem("c");//清除c的值
这里最推荐使用的自然是getItem()和setItem()，清除键值对使用removeItem()。如果希望一次性清除所有的键值对，可以使用clear()。另外，HTML5还提供了一个key()方法，可以在不知道有哪些键值的时候使用，如下：
var storage = window.localStorage;
function showStorage(){
for(var i=0;i<storage.length;i++){
//key(i)获得相应的键，再用getItem()方法获得对应的值
document.write(storage.key(i)+ " : " + storage.getItem(storage.key(i)) + "<br>");
}
}
3.业务需求
表单实时保存数据，下次打开则提示是否继续编辑。图片等控件不支持，只支持简单的控件。【防止突然断电或浏览器崩溃时，下次打开还可以继续编辑并保存】。这样自然而然就想到了HTML5的本地存储功能。既然js写的烂，写的差，就当练手了。
其实这些数据的保存很简单，无非就是一些简单的标签数据的保存。先来一个最简单的js版本。
1 /** 2 * 功能：保存用户修改完form标签内容在LocalStorage中。 3 * 作者：黄金锋 (549387177@qq.com) 4 * 日期：2015-11-1 11:14:01 5 * 修改：2015-11-11 16:09:00 6 * 版本：version 2.0 7 */ 8 9 define(function () {10 11 //从localStorage中加载数据12 function onload(form) {13 14 var fh = form_handler;15 var p = fh.getParams(form);16 if (!p.bimId || !p.formId || !p.iid) {17 return;18 }19 var id = 'FORM_' + DCI.LoginUser.UserId + '_' + p.bimId + '_' + p.formId + '_' + p.iid;20 //alert(id);21 22 var formDataDb;23 var allControl = $(form).find("input:text[name],textarea[name]");24 25 //从本地取26 var storage = localStorage.getItem(id);27 if (storage != null) {28 var myData = JSON.parse(storage);29 allControl.each(function (i, e) {30 var name = $(e).attr("name");31 if (myData[name] != null) {32 $(e).val(myData[name]);33 $(e).change();34 }35 });36 }37 38 39 //绑定change事件40 allControl.each(function (i, el) {41 var name = $(el).attr('name');42 if (name) {43 $(el).on('change', function () {44 onchange(this);45 });46 }47 });48 49 //保存修改的数据50 function onchange(el) {51 var storage = localStorage.getItem(id);52 if (storage == null) {53 formDataDb = new Object();54 var key = $(el).attr("name");55 var value = $(el).val();56 formDataDb[key] = value;57 localStorage.setItem(id, JSON.stringify(formDataDb));58 } else {59 var myData = JSON.parse(storage);60 var key = $(el).attr("name");61 var value = $(el).val();62 myData[key] = value;63 localStorage.setItem(id, JSON.stringify(myData));64 }65 }66 };67 68 //删除localStorage中的数据69 function onsave(form) {70 var fh = form_handler;71 var p = fh.getParams(form);72 var id = 'FORM_' + DCI.LoginUser.UserId + '_' + p.bimId + '_' + p.formId + '_' + p.iid;73 localStorage.removeItem(id);74 75 var allGrid = $(form).find(".form-table");76 var formId = $(form).data("formid");77 allGrid.each(function (index,element) {78 var formName = $(element).find("input:hidden[data-formid]").attr("name");79 var storageKey = "FORM_" + formId + "_" + formName;80 localStorage.removeItem(storageKey);81 });82 }83 84 return {85 onload: onload,86 onsave: onsave,87 }88 }); 表单都是自动通过模版生成的，这里附上表单加载需要的form.js.
1 if (!window.form_handler) {//防止重复加载 2 window.f_action = new (function () { //表单事件处理对象，封装表单事件的处理程序 3 4 this.seltime = function () { 5 if ($.fn.datetimepicker) { 6 var $input = $(this).parent().find('input'); 7 if (!$input.attr('readonly')) { 8 var format; 9 if (!$input.data('datetimepicker')) { //添加日期控件 10 format = form_handler.getElDateFormat($input); 11 var minView = 2; 12 if (format.indexOf('i') >= 0) 13 minView = 0; 14 var form = $(this).closest('form'); 15 $input.datetimepicker({ 16 startDate: new Date('100/1/1'), 17 endDate: new Date('10000/1/1'), 18 format: format, 19 language: 'zh-CN', 20 todayHighlight: true, 21 autoclose: true, 22 minView: minView, 23 todayBtn: true, 24 forceParse: false, 25 container: form 26 }); 27 } 28 $input.datetimepicker('show'); 29 30 var val = form_handler.getElDateValue($input, format); 31 if (val) { 32 var date = new Date(val); 33 if (date && date != 'Invalid Date') 34 $input.datetimepicker('update', date); 35 } 36 } 37 } 38 }; 39 40 this.joinControl = function (sender, target, value, isExpression, conditionFields, isDataSource) { 41 if (!$(sender).attr('readonly')) 42 form_handler.joinControl(sender, target, value, isExpression, conditionFields, isDataSource); 43 }; 44 45 this.runMethod = function (sender, method, params) { 46 if (!$(sender).attr('readonly')) { 47 require(['form.run'], function () { 48 var func = eval('form_run.' + method); 49 if (func) { 50 var form = $(sender).parents('form'); 51 var b = form_handler.getParams(form); 52 func.call(sender, form, b, params); 53 } 54 else 55 alert('未实现函数' + method); 56 }); 57 } 58 }; 59 60 this.selectGlossary = function (sender) { 61 var ctrl = $(sender).parent().find('input,textarea'); 62 if (ctrl.length) { 63 if (!ctrl.attr('readonly')) { 64 var field = ctrl.attr('name'); 65 var form = $(sender).closest('form'); 66 var formId = form.data('formid'); 67 var glossaryKey = ctrl.data('glossary'); 68 require(['glossary'], function () { 69 g_action.showGlossary(formId + '_' + field, ctrl, form, glossaryKey, function (ctrl) { 70 var el; 71 if ($(ctrl).css('position') == 'absolute') 72 el = $(ctrl); 73 else //寻找绝对定位的父节点 74 $(ctrl).parentsUntil('form').each(function (i, e) { 75 if ($(e).css('position') == 'absolute') 76 el = $(e); 77 }); 78 if (el) { 79 var position = $(el).position(); 80 return { 81 top: position.top + $(el).height(), 82 left: position.left, 83 }; 84 } 85 }); 86 }); 87 } 88 } 89 }; 90 91 this.runform = function (sender, formtype, formId, variables, controls, iid) { 92 var mainForm = $(sender).closest('form'); 93 if (formtype == 'changeform') { 94 for (var i in controls) { 95 if (controls[i][1].indexOf('$[ID]') > -1 && !form_handler.getElValue(mainForm, controls[i][0])) { 96 alert('找不到记录。'); 97 return; 98 } 99 } 100 } 101 var reg = /\$\[([^[\]]+)\]/g; 102 var data = { 103 }; 104 data.formId = formId; 105 data.formType = formtype; 106 data.dialogId = 'DialogRunForm'; 107 if (iid) { 108 data.iid = iid.replace(reg, function (str, subStr) { 109 return form_handler.getElValue(mainForm, subStr); 110 }); 111 } 112 var url = DefaultUrl + 'Form/DialogRunForm'; 113 showAjaxDialog(data.dialogId, url, data, true, document.body, function (state, data) { 114 if (state == 'ok') { 115 var childForm = $('#DialogRunForm form'); 116 if (formtype == 'addform') { 117 var idVal = childForm.find('[name="ID"]').val(); 118 childForm.data('iid', idVal); 119 childForm.data('bimid', idVal);//兼容3.0 120 form_handler.submitForm(childForm, submitFormCallback, document.body); 121 } 122 else if (formtype == 'changeform') { 123 form_handler.submitForm(childForm, submitFormCallback, document.body); 124 } 125 else if (formtype == 'queryform') { 126 if (childForm.find('table tr.active').length) 127 submitFormCallback(); 128 else 129 alert('请选择一行。'); 130 } 131 } 132 133 function submitFormCallback() { 134 for (var i in controls) { 135 var c = controls[i]; 136 var v = c[1].replace(reg, function (str, subStr) { 137 return form_handler.getElValue(childForm, subStr); 138 }); 139 form_handler.getEl(mainForm, c[0]).val(v); 140 } 141 $('#DialogRunForm').modal('hide'); 142 } 143 }, function (data, btn) { 144 $('#DialogRunForm .modal-title').text($(sender).val()); 145 form_handler.openFormCallback($('#DialogRunForm form')); 146 }); 147 }; 148 149 this.urlChanged = function (scrop, iframeclass) { 150 var url = $(scrop).val(); 151 $('.' + iframeclass).attr('src', url); 152 }; 153 })(); 154 155 window.form_handler = new function () { //表单操作对象，提供接口供外部调用 156 157 var $this = this; 158 159 this.openFormCallback = function (form, dirtyCallback) { 160 161 initElement();//初始化基本元素 162 initCtrl();//初始化控件 163 initModify();//修改痕迹 164 onload();//load事件 165 166 function initElement() { 167 var allControl = $(form).find('input:text,input:checkbox,input:radio,input:hidden,textarea'); 168 allControl.each(function (i, el) { 169 var name = $(el).attr('name'); 170 if (name) { 171 $(el).on('change', function () { 172 onchange(this); 173 }); 174 } 175 }); 176 $(form).find('input:checkbox,input:radio').change(function (e) { 177 if ($(this).is('input:radio')) { 178 var name = $(this).attr('name'); 179 $(form).find('input:radio[name="' + name + '"]').val('0').data('dirty', true); 180 } 181 if ($(this).is(':checked')) 182 $(this).val('1'); 183 else 184 $(this).val('0'); 185 }); 186 $(form).find('input[readonly],textarea[readonly]').keydown(function (evt) { 187 if (evt.keyCode == 8) return false 188 }); 189 //触发事件 190 allControl.each(function (i, el) { 191 if ($(el).attr('data-dirty') == 'true') { 192 $(el).change();//联动 193 } 194 }); 195 } 196 197 function onchange(el) { 198 var d = $(form).data('dirty'); 199 $(form).data('dirty', true);//表单已修改 200 $(el).data('dirty', true);//控件已修改 201 if (!d && dirtyCallback) 202 dirtyCallback(form); 203 } 204 205 function initCtrl() { 206 initGrid(); 207 reqCtrl('.form-img:not(.hidden):not([disabled])', ['form.ctrl.image']); 208 reqCtrl('.richtextbox:not(.hidden)', ['form.ctrl.richtextbox']); 209 reqCtrl('.user-picker:not(.hidden)', ['form.ctrl.userpicker']); 210 reqCtrl('.form-chart:not(.hidden)', ['form.ctrl.chart']); 211 reqCtrl('.popover-toggle:not(.hidden)', ['form.ctrl.popover']); 212 reqCtrl('.Iframe:not(.hidden)', ['form.ctrl.Iframe']); 213 reqCtrl('.form-codeimage:not(.hidden)', ['form.ctrl.codeimg']); 214 } 215 216 function initGrid() { 217 $(form).find('.form-table').each(function (i, cform) { 218 var ipt = $(cform).find('input[name]'); 219 var formId = ipt.data('formid'); 220 var init = JSON.parse($(cform).find('input[data-param="init"]').val()); 221 var initsame = JSON.parse($(cform).find('input[data-param="initsame"]').val()); 222 $(cform).on('click', 'tr', selrow); 223 $(cform).find('.form-table-body').scroll(scrollTable); 224 $(cform).on('click', 'td.form-table-edit', editRow); 225 226 if (!$(cform).hasClass('disabled')) { 227 $(cform).on('click', function (event) { 228 if (!$(event.target).is('input[name]')) 229 ipt.click(); 230 }); 231 $(cform).on('click', '.form-table-footer button.add-row', addRow); 232 if (initsame.length) 233 $(cform).on('click', '.form-table-footer button.add-samerow', addRow); 234 else 235 $(cform).find('button.add-samerow').remove(); 236 $(cform).on('click', '.form-table-footer button.del-row', delRow); 237 $(cform).on('change', 'td input[type="checkbox"]', chkChange); 238 if (ipt.data('dirty')) { 239 $(cform).find('tr').data('insert', true); 240 } 241 } 242 else { 243 $(cform).find('input[type="checkbox"]').attr('disabled', 'disabled'); 244 $(cform).find('.form-table-footer').remove(); 245 $(cform).find('.form-table-body').css('bottom', 0); 246 } 247 dataGridTplRender($(cform).find('table')); 248 249 function chkChange() { 250 var $this = $(this); 251 var val = '0'; 252 if ($this.is(':checked')) 253 val = '1'; 254 $this.val(val); 255 var tr = $(this).closest('tr'); 256 tr.data('update', true); 257 ipt.change(); 258 if (window.localStorage) { 259 var table = $this.closest('table'); 260 var name = table.find('colgroup col').eq($this.closest('td').index()).data('index'); 261 var row_data = { 262 }; 263 row_data[name] = val; 264 require(['form.storage'], function (s) { 265 s.ongridedit(form, table, row_data, tr); 266 }); 267 } 268 } 269 270 function selrow() { 271 $(this).siblings().removeClass('active'); 272 $(this).addClass('active'); 273 } 274 275 function scrollTable() { 276 var left = $(this).scrollLeft(); 277 $(this).siblings('.form-table-header').css('margin-left', -left); 278 } 279 280 function editRow(e) { 281 var data = { 282 formId: formId, 283 readOnly: $(cform).hasClass('disabled') ? 1 : 0 284 }; 285 var tr = $(this).closest('tr'); 286 showAjaxDialog('DialogGridRow', DefaultUrl + 'Form/DialogGridRow', data, true, document.body, function (state, data) { 287 if (state == 'ok') { 288 if ($(cform).hasClass('disabled')) { 289 $('#DialogGridRow').modal('hide'); 290 } 291 else if ($this.validateForm($('#DialogGridRow form'))) { 292 var table = tr.closest('table'); 293 var row_data = { 294 }; 295 var cells = tr.find('td'); 296 table.find('colgroup col').each(function (idx, el) { 297 var index = $(el).data('index'); 298 if (index) { 299 var ctrl = $('#DialogGridRow form [name="' + index + '"]'); 300 var td = cells.eq(idx); 301 if (ctrl.length) { 302 var type = $(el).data('type'); 303 var text = ctrl.val(); 304 if (type == 'CheckBox') {//复选框 305 var ck = td.find('input[type="checkbox"]'); 306 ck.val(text); 307 if (text == '1') 308 ck.prop('checked', true); 309 else 310 ck.prop('checked', false); 311 } 312 else { 313 td.text(text); 314 } 315 } 316 var ipt = td.find('input'); 317 if (ipt.length) 318 row_data[index] = ipt.val(); 319 else 320 row_data[index] = td.text(); 321 } 322 }); 323 if (window.form_tpl) { 324 table.find('colgroup col').each(function (idx, el) { 325 if ($(el).data('type') == 'Template') { 326 var tpl = eval('form_tpl.' + $(el).data('tpl')); 327 if (tpl) { 328 cells.eq(idx).html(tpl(row_data, cells.eq(idx - 1).text())); 329 } 330 } 331 }); 332 } 333 if (window.localStorage) 334 require(['form.storage'], function (s) { 335 s.ongridedit(form, table, row_data, tr); 336 }); 337 $('#DialogGridRow').modal('hide'); 338 tr.data('update', true); 339 ipt.change(); 340 tr.click(); 341 } 342 } 343 }, 344 function () { 345 if ($(cform).hasClass('disabled')) 346 $('#DialogGridRow .modal-title').text('查看'); 347 else 348 $('#DialogGridRow .modal-title').text('编辑'); 349 var childForm = $('#DialogGridRow form'); 350 $this.openFormCallback(childForm); 351 //获取列信息 352 var table = tr.parents('table'); 353 table.find('colgroup col').each(function (idx, el) { 354 var td = tr.find('td').eq(idx); 355 var ck = td.find('input[type="checkbox"]'); 356 var value; 357 if (ck.length > 0) value = ck.val(); 358 else value = td.text(); 359 var target = $('#DialogGridRow form [name="' + $(el).data('index') + '"]').val(value); 360 if (target.is(':checkbox')) { 361 if (value == '1') 362 target.attr('checked', 'checked'); 363 else 364 target.removeAttr('checked'); 365 } 366 }); 367 }); 368 } 369 370 function addRow() { 371 var btn = $(this); 372 var selRow = $(cform).find('table tr.active'); 373 if (btn.is('.add-samerow') && !selRow.length) { 374 alert('请选择行。'); 375 return; 376 } 377 var data = { 378 formId: formId 379 }; 380 var table = $(cform).find('table'); 381 showAjaxDialog('DialogGridRow', DefaultUrl + 'Form/DialogGridRow', data, true, document.body, function (state, data) { 382 if (state == 'ok') { 383 var childForm = $('#DialogGridRow form'); 384 var iid = childForm.data('iid'); 385 if (iid) { 386 if ($this.validateForm(childForm)) { 387 var tr = $('<tr></tr>'); 388 var row_data = { 389 }; 390 table.find('colgroup col').each(function (idx, el) { 391 var td = $('<td></td>'); 392 if (idx == 0) { 393 td.append('<span aria-hidden="true"></span>'); 394 td.addClass('form-table-edit'); 395 } 396 else { 397 var index = $(el).data('index'); 398 if (index) { 399 if (index == 'IID') {//主键 400 row_data['IID'] = iid; 401 td.text(iid); 402 } 403 else if (index == 'ID') { 404 row_data['ID'] = form.data('bimid'); 405 td.text(row_data['ID']); 406 } 407 else { 408 var ctrl = $('#DialogGridRow form [name="' + index + '"]'); 409 if (ctrl.length) { 410 var type = $(el).data('type') 411 var text = ctrl.val(); 412 if (type == 'CheckBox') { 413 var val = text == '1' ? '1' : '0'; 414 td.append('<input type="checkbox" value="' + val + '" ' + (val == '1' ? 'checked="checked"' : '') + ' />'); 415 } 416 else { 417 td.text(text) 418 } 419 row_data[index] = text; 420 } 421 } 422 } 423 } 424 if ($(el).attr('width') == '0') 425 td.addClass('hidden'); 426 td.appendTo(tr); 427 }); 428 if (window.form_tpl) { 429 var cells = tr.find('td'); 430 table.find('colgroup col').each(function (idx, el) { 431 if ($(el).data('type') == 'Template') { 432 var tpl = eval('form_tpl.' + $(el).data('tpl')); 433 cells.eq(idx).html(tpl(row_data, cells.eq(idx - 1).text())); 434 } 435 }); 436 } 437 438 table.append(tr); 439 if (window.localStorage) 440 require(['form.storage'], function (s) { 441 s.ongridadd(form, table, row_data, tr); 442 }); 443 $('#DialogGridRow').modal('hide'); 444 tr.data('insert', true); 445 refreshGridRownum(table); 446 ipt.change(); 447 448 tr.click(); 449 } 450 } 451 } 452 }, function () { 453 $('#DialogGridRow .modal-title').text('新增'); 454 var childForm = $('#DialogGridRow form'); 455 $this.openFormCallback(childForm); 456 $.ajax({ 457 url: DefaultUrl + 'Form/GetChildFormIID', 458 type: 'post', 459 data: { 460 formId: formId 461 }, 462 cache: false, 463 loadingScope: document.body, 464 success: function (r) { 465 var iid = r.Data[0][0]; 466 childForm.data('iid', iid); 467 } 468 }); 469 for (var key in init) { 470 if (key != 'IID') { 471 var value = init[key]; 472 var reg = /\$\[([^[\]]+)\]/g; 473 var value = value.replace(reg, function (str, subStr) { 474 return $this.getElValue(form, subStr); 475 }); 476 childForm.find('[name="' + key + '"]').val(value); 477 } 478 } 479 if (btn.is('.add-samerow')) {//新增相同 480 var table = selRow.closest('table'); 481 var cols = table.find('colgroup col'); 482 $.each(initsame, function () { 483 var key = this; 484 cols.each(function (idx, el) { 485 if ($(el).data('index') == key) { 486 var td = selRow.find('td').eq(idx); 487 var ck = td.find('input[type="checkbox"]'); 488 var value; 489 if (ck.length > 0) value = ck.val(); 490 else value = td.text(); 491 var target = $('#DialogGridRow form [name="' + key + '"]').val(value); 492 if (target.is(':checkbox')) { 493 if (value == '1') 494 target.attr('checked', 'checked'); 495 else 496 target.removeAttr('checked'); 497 } 498 return false; 499 } 500 }); 501 }); 502 } 503 }); 504 } 505 506 function delRow(e) { 507 var table = $(cform).find('table'); 508 var tr = table.find('tr.active'); 509 if (tr.length) { 510 tr.removeClass('active').hide(); 511 if (window.localStorage) { 512 require(['form.storage'], function (s) { 513 s.ongriddel(form, table, tr); 514 }); 515 } 516 tr.data('delete', true); 517 if (tr.data('insert')) 518 tr.remove(); 519 refreshGridRownum($(cform).find('table')); 520 ipt.change(); 521 } 522 else 523 alert('请选择行。'); 524 } 525 }); 526 } 527 528 function reqCtrl(selector, deps) { 529 var ctrls = $(form).find(selector); 530 if (ctrls.length) { 531 require(deps, function (r) { 532 ctrls.each(function () { 533 if (r instanceof Function) 534 r.apply(this); 535 else if (r instanceof Object) 536 r.onload.apply(this); 537 }) 538 }); 539 } 540 } 541 542 function initModify() { 543 544 $(form).mousedown(function (e) { 545 if ($(form).data('readmark-loaded') && $(e.target).is('input:text,input:checkbox,input:hidden,textarea') && $(e.target).data('modified')) { 546 var el = e.target; 547 var name = $(el).attr('name'); 548 if (name) { 549 if (!$(el).data('show-popover')) { 550 $(el).data('show-popover', true); 551 //$(el).data('timer', setTimeout(function (el) { 552 var iid = $(form).data('iid'); 553 var formId = $(form).data('formid'); 554 $(el).data('getting-modifyLog', true); 555 $.ajax({ 556 url: DefaultUrl + 'Form/ModifyLogData', 557 data: { 558 iid: iid, formId: formId, field: name 559 }, 560 cache: false, 561 loadingScope: document.body, 562 success: function (r) { 563 if ($(r).find('ul li').length && $(el).data('show-popover')) { 564 $(form).find('.popover').remove(); 565 $(el).popover({ 566 content: r, 567 html: true, 568 trigger: 'manual', 569 placement: 'left', 570 animation: true, 571 container: $(form), 572 template: '<div role="tooltip"><div ></div><div ></div></div>' 573 }); 574 $(el).popover('show'); 575 $(form).find('.popover').mouseenter(function () { 576 $(el).data('show-popover', false); 577 }).mouseleave(function () { 578 $(el).popover('destroy'); 579 }); 580 } 581 }, 582 complete: function () { 583 $(el).data('getting-modifyLog', false); 584 } 585 }); 586 //}, 100, el)); 587 } 588 } 589 } 590 }); 591 592 $(form).mouseout(function (e) { 593 if ($(form).data('readmark-loaded') && $(e.target).is('input:text,input:checkbox,input:hidden,textarea') && $(e.target).data('modified')) { 594 var el = e.target; 595 if (!$(el).data('getting-modifyLog')) { 596 var name = $(el).attr('name'); 597 if (name) { 598 //var t = $(this).data('timer'); 599 //if (t) 600 // clearTimeout(t); 601 if ($(form).find('.popover').length) { 602 if ($(el).data('show-popover')) { 603 setTimeout(function () { 604 if ($(el).data('show-popover')) { 605 $(el).data('show-popover', false); 606 $(el).popover('destroy'); 607 } 608 }, 100); 609 } 610 } 611 else { 612 $(el).data('show-popover', false); 613 $(el).popover('destroy'); 614 } 615 } 616 } 617 } 618 }); 619 } 620 621 function onload() { 622 if (window.localStorage) 623 require(['form.storage'], function (s) { 624 s.onload(form); 625 }); 626 if ($(form).data('onload')) 627 (function () { 628 eval($(form).data('onload')); 629 }).apply(form); 630 } 631 }; 632 633 function dataGridTplRender(table) { 634 if (table.find('colgroup col[data-type="Template"]').length) { 635 require(['form.tpl'], function () {//模板列 636 var cols = []; 637 var tpls = []; 638 table.find('colgroup col').each(function (idx, el) {//获取列信息 639 cols[idx] = $(el).data('index'); 640 if ($(el).data('type') == 'Template') { 641 var tplStr = $(el).data('tpl'); 642 var tpl = eval('form_tpl.' + tplStr); 643 if (tpl != null) 644 tpls.push({ index: idx, tpl: tpl }); 645 else//告知错误原因 646 alert('模板[' + tplStr + ']没定义。'); 647 } 648 }); 649 if (tpls.length) { 650 table.find('tr').each(function (idx, el) { 651 var row_data = {}; 652 var cells = $(el).find('td'); 653 cells.each(function (idx, el) {//获取行数据 654 if (cols[idx]) { 655 var ipt = $(el).find('input'); 656 if (ipt.length) 657 row_data[cols[idx]] = ipt.val(); 658 else 659 row_data[cols[idx]] = $(el).text(); 660 } 661 }); 662 $.each(tpls, function () { 663 var td = cells.eq(this.index); 664 td.html(this.tpl(row_data, cells.eq(this.index - 1).text())); 665 }); 666 }); 667 } 668 }); 669 } 670 } 671 672 this.joinControl = function (sender, target, value, isExpression, conditionFields, isDataSource) { 673 if (isDataSource) {//数据源 674 $this.getDataSource(sender, value, [target], conditionFields); 675 } 676 else { 677 var result; 678 if ((result = /\$\{substr,([^,]+),(\d+),(\d+)\}\s+([^\s]+)/.exec(value)) != null) {//截取字符串，谁设计的！！！！ 679 var sourceField = result[1]; 680 var startIdx = result[2]; 681 var length = result[3]; 682 var targetField = result[4]; 683 var form = $(sender).closest('form'); 684 var sourceValue = $this.getElValue(form, sourceField.replace('@', '#')); 685 if (sourceValue != null) { 686 $this.getEl(form, targetField).val(sourceValue.substr(parseInt(startIdx), parseInt(length))).change();//联动 687 } 688 } 689 else if ((result = /\$\{toStr,([^,]+),([^,]+)\}/.exec(value)) != null) { //日期格式转换，又是谁设计的！！！ 690 var name = result[1]; 691 var format = result[2]; 692 var form = $(sender).closest('form'); 693 var el = $this.getEl(form, name); 694 if (el.length) { 695 var val = $this.getElDateValue(el); 696 if (val) { 697 var date = new Date(val); 698 var targetValue = $this.getFomatDate(date, format); 699 form.find('[name="' + target + '"]').val(targetValue).change();//联动 700 } 701 } 702 } 703 else { //取值，包括系统值（从服务端）和其它字段值（从客户端），然后计算值 704 var sysName = { 705 }; 706 var reg = /\$\{([^{}]+)\}/g; 707 var i = 0; 708 while ((result = reg.exec(value)) != null) { 709 sysName['[' + i + ']'] = result[1]; 710 i++; 711 } 712 if (i > 0) { //服务端取系统值 713 $.ajax({ 714 url: DefaultUrl + 'Form/GetSysValue', 715 type: 'post', 716 cache: false, 717 data: sysName, 718 success: function (r) { 719 joinControlCallback(sender, target, value, isExpression, r, isDataSource); 720 }, 721 error: function () { 722 alert('取系统值失败！'); 723 } 724 }); 725 } 726 else { 727 joinControlCallback(sender, target, value, isExpression, { 728 }, isDataSource); 729 } 730 } 731 } 732 }; 733 734 function joinControlCallback(sender, target, value, isExpression, sysValue) { 735 try { 736 var form = $(sender).closest('form'); 737 var $target, matches; 738 if (matches = (/([^:]+):item:([^:]+)/gi).exec(target)) 739 $target = getSelectCell(form, matches).cell; 740 else 741 $target = form.find('[name="' + target + '"],[data-name="' + target + '"]'); 742 743 if ($target.length) { 744 var reg = /\$\[([^[\]]+)\]/g; 745 var value = value.replace(reg, function (str, subStr) { 746 if (subStr.substr(0, 1) == '#') { 747 var el = form.find('[name="' + subStr.substr(1) + '"]'); 748 if (el.data('combobox')) 749 return getComboBoxValueText(el).text; 750 } 751 return $this.getElValue(form, subStr); 752 }); 753 reg = /\$\{([^{}]+)\}/g; 754 value = value.replace(reg, function (str, subStr) { 755 return sysValue[subStr]; 756 }); 757 if (isExpression) { 758 value = calcValue(value); 759 } 760 //联动 761 if ($target.is(':text,textarea')) { 762 var ov = $target.val(); 763 if (!(!ov && !value || ov == value)) { 764 $target.val(value); 765 $target.change(); 766 } 767 } 768 else if ($target.is('td')) {//子表的单元格 769 var ov = $target.text(); 770 if (!(!ov && !value || ov == value)) { 771 $target.text(value); 772 $target.parent('tr').data('update', true); 773 $target.closest('.form-table').find('input[name]').change(); 774 } 775 } 776 else if ($target.data('codeimg')) {//二维码条形码 777 require(['form.ctrl.codeimg'], function (obj) { 778 obj.changeVal($target, value); 779 }); 780 } 781 } 782 } 783 catch (err) { 784 alert("脚本错误！"); 785 } 786 787 function calcValue(value) { 788 value = value.replace(/toNumber\(\s*\)/, '0').replace(/roundFloat\(\s*,\s*\d+\s*\)/, '0'); 789 value = eval(value); 790 791 if (isNaN(value) || value == null) 792 return ''; 793 if (typeof (value) == 'number') { 794 var str = String(value); 795 if (/\.[0-9]{8}/.test(str))//脚本坑爹的算术运算 796 str = String(roundFloat(value, 2)); 797 return str; 798 } 799 return String(value); 800 } 801 } 802 803 this.getDataSource = function (sender, sourceId, fields, conditionFields, callback) { 804 var form = $(sender).closest('form'); 805 var data = $this.getParams(form); 806 data.sourceId = sourceId; 807 data.fieldName = fields.length > 0 ? fields[0] : null; 808 for (var i in conditionFields) { 809 var f = conditionFields[i]; 810 var value; 811 if (f == 'ID')//后期或者改成服务端处理 812 value = data.bimId; 813 else 814 value = $this.getElValue(form, f); 815 data['F[' + f + ']'] = value; 816 } 817 $.ajax({ 818 url: DefaultUrl + 'Form/GetFormDataSource', 819 type: 'post', 820 cache: false, 821 data: data, 822 loadingScope: document.body, 823 success: function (r) { 824 for (var i in fields) { 825 var control = form.find('[name="' + fields[i] + '"],[data-name="' + fields[i] + '"]'); 826 if (control.data('combobox')) { 827 var ul = control.siblings('ul'); 828 ul.empty(); 829 for (var j in r.Data) { 830 ul.append($('<li></li>').text(r.Data[j][1]).data('value', r.Data[j][0])); 831 } 832 } 833 else if (control.data('datagrid')) {//查询表单才用 834 var hash = { 835 }; 836 for (var i = 0; i < r.Metadata.length; i++) 837 hash[r.Metadata[i].ID] = i; 838 var box = control.closest('.form-table'); 839 var cols = box.find('table colgroup col'); 840 var map = { 841 }; //映射 842 for (var i = 0; i < cols.length; i++) { 843 var name = cols.eq(i).data('index'); 844 if (name && hash[name] != undefined) { 845 map[i] = { 846 idx: hash[name], col: cols.eq(i) 847 }; 848 } 849 else { 850 map[i] = { 851 col: cols.eq(i) 852 }; 853 } 854 } 855 var tb = box.find('table'); 856 tb.find('tr').remove(); 857 for (var i = 0; i < r.Data.length; i++) { 858 var tr = $('<tr></tr>'); 859 var disabled = box.hasClass('disabled'); 860 var disabledStr = disabled ? 'disabled="disabled"' : ''; 861 for (var j = 0; j < cols.length; j++) { 862 var td = $('<td></td>'); 863 if (!disabled && j == 0) { 864 td.addClass('form-table-edit'); 865 td.append('<span aria-hidden="true"></span>'); 866 } 867 else if (map[j].idx != undefined) { 868 if (cols.eq(j).data('type') == 'CheckBox') { 869 var v = r.Data[i][map[j].idx]; 870 if (v == 1 || v == '1') 871 td.append('<input type="checkbox" value="1" checked="checked" ' + disabledStr + ' />'); 872 else 873 td.append('<input type="checkbox" value="0" ' + disabledStr + ' />') 874 } 875 else { 876 td.text(r.Data[i][map[j].idx]); 877 } 878 } 879 if (map[j].col.attr('width') == 0) 880 td.addClass('hidden'); 881 tr.append(td); 882 } 883 tb.append(tr); 884 } 885 dataGridTplRender(tb); 886 refreshGridRownum(tb); 887 } 888 else if (control.hasClass('form-chart')) {//图表控件 889 var accountId = r.Data.accountid; 890 if (accountId) { 891 var query = {}, j = 0; 892 for (var i = 0; i < r.Data.conditions.length; i++) { 893 var c = r.Data.conditions[i]; 894 if (c.value) { 895 var empty = true, hasCtrl = false; 896 var v = c.value.replace(/\$\[([^[\]$]+)\]/g, function (str, name) { 897 hasCtrl = true; 898 var elv = $this.getElValue(form, name); 899 if (elv) empty = false; 900 return elv; 901 }); 902 if (!(hasCtrl && c.checkNullField == 'true' && empty)) 903 query['filters[' + (j++) + ']'] = v; 904 } 905 } 906 require(['form.ctrl.chart'], function (c) { 907 c.loadChart(control, accountId, query); 908 }); 909 } 910 } 911 else if (control.is('input') || control.is('textarea')) { 912 if (r.Data.length > 0 && r.Data[0].length > 0) { 913 var value = r.Data[0][0] 914 var change = false; 915 if (control.is(':text,textarea')) { 916 var ov = control.val(); 917 if (!(!ov && !value || ov == value)) 918 change = true; 919 } 920 if (change) { 921 control.val(value); 922 control.change(); 923 } 924 } 925 } 926 } 927 if (callback) 928 callback(r); 929 }, 930 error: function () { 931 alert('数据源' + sourceId + '获取失败。'); 932 } 933 }); 934 }; 935 936 this.getEl = function (form, name) { 937 return form.find('[name="' + name + '"]'); 938 }; 939 940 this.getElValue = function (form, name) { //获得元素值 941 var val = ''; 942 var matches; 943 if (matches = (/([^:]+):format:([^:]+)/gi).exec(name)) {//时间格式 944 name = matches[1]; 945 var f = matches[2]; 946 var el = form.find('[name="' + name + '"]'); 947 if (el.hasClass('datetime')) { 948 var dateStr = this.getElDateValue(el); 949 if (dateStr) { 950 var date = new Date(dateStr); 951 val = this.getFomatDate(date, f); 952 } 953 } 954 else { 955 val = el.val(); 956 } 957 } 958 else if (matches = (/([^:]+):item:([^:]+)/gi).exec(name)) { //选中行的值 959 var elInfo = getSelectCell(form, matches); 960 name = elInfo.name; 961 if (elInfo.cell.length) 962 val = elInfo.cell.text(); 963 } 964 else if (matches = (/([^:]+):sum:([^:]+)/gi).exec(name)) { //计算子表列总和 965 name = matches[1]; 966 var colname = matches[2]; 967 var el = form.find('[name="' + name + '"]').parent(); 968 var table = el.find('table'); 969 var idx = -1; 970 var sum = 0; 971 var err = false; 972 table.find('colgroup:first').find('col').each(function (i, e) { 973 if ($(e).data('index') == colname) 974 idx = i; 975 }); 976 if (idx > -1) { 977 table.find('tr').each(function (i, e) { 978 if ($(e).is(':visible')) { 979 var num = $(e).find('td').eq(idx).text(); 980 if (num != null && num != '') { 981 var v = parseFloat(num); 982 if (isNaN(v)) { 983 if (!err) { 984 alert(num + '不是数字'); 985 err = true; 986 } 987 } 988 else 989 sum += v; 990 } 991 } 992 }); 993 } 994 if (err) val = ''; 995 else val = sum.toString(); 996 } 997 else if (matches = /#([^#]+)/.exec(name)) { 998 var el = form.find('[name="' + matches[1] + '"]'); 999 if (el.data('combobox'))1000 val = getComboBoxValueText(el).text;1001 }1002 else {1003 var el = form.find('[name="' + name + '"]');1004 if (el.data('combobox'))1005 val = getComboBoxValueText(el).value;1006 else1007 val = el.val();1008 }1009 if (val != null)1010 return val;1011 else return '';1012 };1013 1014 function getComboBoxValueText(input) {1015 var val = input.val();1016 var ul = input.siblings('ul');1017 var lis = ul.find('li');1018 for (var i = 0; i < lis.length; i++) {1019 var li = lis.eq(i)1020 var text = li.text();1021 if (!val && !text || val == text) {1022 return {1023 value: li.data('value'), text: text1024 };1025 }1026 }1027 return {1028 value: input.val(), text: input.val()1029 };1030 }1031 1032 function getSelectCell(form, matches) {1033 var name = matches[1];1034 var colname = matches[2];1035 var table = $(form).find('[name="' + name + '"]').closest('.form-table').find('table');1036 var tr = table.find('tr.active');1037 var cell;1038 if (tr.length) {1039 var idx = -1;1040 table.find('colgroup').find('col').each(function (i, e) {1041 if ($(e).data('index') == colname)1042 idx = i;1043 });1044 if (idx > -1) {1045 cell = tr.find('td').eq(idx);1046 }1047 }1048 return { name: name, cell: cell ? cell : $() };1049 }1050 1051 this.formatValue = function (form, value) {1052 return value.replace(/\$\[([^[\]$]+)\]/, function (str, name) {1053 return $this.getElValue(form, name);1054 });1055 }1056 1057 this.getFomatDate = function (date, format) {1058 return format.replace(/y+/gi, function (str) {1059 var year = date.getFullYear().toString();1060 if (str.length == 2)1061 return year.length > 1 ? year.substr(year.length - 2) : year;1062 return year;1063 }).replace(/m+/gi, function (str) {1064 var month = (date.getMonth() + 1).toString();1065 if (str.length == 2)1066 return month.length > 1 ? month : '0' + month;1067 return month;1068 }).replace(/d+/gi, function (str) {1069 var day = date.getDate().toString();1070 if (str.length == 2)1071 return day.length > 1 ? day : '0' + day;1072 return day;1073 }).replace(/h+/gi, function (str) {1074 var hour = date.getHours().toString();1075 if (str.length == 2)1076 return hour.length > 1 ? hour : '0' + hour;1077 return hour;1078 }).replace(/i+/gi, function (str) {1079 var minute = date.getMinutes().toString();1080 if (str.length == 2)1081 return minute.length > 1 ? minute : '0' + minute;1082 return minute;1083 }).replace(/s+/gi, function (str) {1084 var second = date.getSeconds().toString();1085 if (str.length == 2)1086 return second.length > 1 ? second : '0' + second;1087 return second;1088 });1089 };1090 1091 this.getElDateFormat = function (el) {1092 var format = $(el).data('date-format');1093 if (!format) //yyyy-mm-dd hh:ii:ss1094 format = 'yyyy-m-d';1095 else1096 format = format.replace(/y+/gi, 'yyyy')1097 .replace(/m+/gi, 'm')1098 .replace(/d+/gi, 'd')1099 .replace(/h+/gi, 'h')1100 .replace(/i+/gi, 'i')1101 .replace(/s+/gi, 's');1102 return format;1103 }1104 1105 this.getElDateValue = function (el, format) {1106 var value = $(el).val();1107 if (value) {1108 if (!format) {1109 format = this.getElDateFormat(el);1110 }1111 var year, month, day, hour, minute, second;1112 var replace = [];1113 var regex = new RegExp('^' + format.replace(/y+|m+|d+|h+|i+|s+/gi, function (str) {1114 replace.push(str);1115 return '(\\d+)'1116 }) + '$');1117 var matches = regex.exec(value);1118 if (matches) {1119 for (var i = 0; i < replace.length; i++) {1120 var replaceStr = replace[i];1121 var replaceValue = matches[i + 1];1122 switch (replaceStr) {1123 case 'yyyy': year = replaceValue; break;1124 case 'm': month = replaceValue; break;1125 case 'd': day = replaceValue; break;1126 case 'h': hour = replaceValue; break;1127 case 'i': minute = replaceValue; break;1128 case 's': second = replaceValue; break;1129 }1130 }1131 return validateDate(parseInt(year, 10), parseInt(month, 10), parseInt(day, 10), parseInt(hour, 10), parseInt(minute, 10), parseInt(second, 10));1132 }1133 }1134 };1135 1136 function validateDate(year, month, day, hour, minute, second) { //校验日期是否合法1137 if (!isNaN(year) && (year < 100 || year > 9999)) //js:[100,未知] .net,oracle:[1,9999]1138 return;1139 if (!isNaN(month) && (month < 1 || month > 12))1140 return;1141 if (!isNaN(day)) {1142 if (!isNaN(year) && !isNaN(month)) {1143 var maxDay;1144 if (month == 2) {//检测闰年1145 if (year % 400 == 0 || year % 4 == 0 && year % 100 != 0)1146 maxDay = 29;1147 else1148 maxDay = 28;1149 }1150 else if (month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12)1151 maxDay = 31;1152 else1153 maxDay = 30;1154 if (day < 1 || day > maxDay)1155 return;1156 }1157 else1158 return;1159 }1160 if (!isNaN(hour) && (hour < 0 || hour > 23))1161 return;1162 if (!isNaN(minute) && (minute < 0 || minute > 59))1163 return;1164 if (!isNaN(second) && (second < 0 || second > 59))1165 return;1166 1167 return (isNaN(year) ? '100' : year) + '/' +1168 (isNaN(month) ? '1' : month) + '/' +1169 (isNaN(day) ? '1' : day) + ' ' +1170 (isNaN(hour) ? '0' : hour) + ':' +1171 (isNaN(minute) ? '0' : minute) + ':' +1172 (isNaN(second) ? '0' : second);1173 }1174 1175 this.validateForm = function (form, invalidHandler) {1176 if ($.fn.validate) {1177 $(form).data('invalid-handler', invalidHandler)1178 var validator = $(form).validate({1179 showErrors: function (errMap, errList) {1180 this.defaultShowErrors();1181 },1182 errorPlacement: function (label, element) {1183 $(form).append(label);1184 var el = $(element);1185 if ($(element).css('position') != 'absolute') {1186 var closest = element.parentsUntil('form');1187 for (var i = closest.length - 1; i >= 0; i--) {1188 if (closest.eq(i).css('position') == 'absolute') {1189 el = closest.eq(i);1190 break;1191 }1192 }1193 }1194 var left = parseFloat(el.css('left').substring(0, el.css('left').length - 2));1195 var top = parseFloat(el.css('top').substring(0, el.css('top').length - 2));1196 left = isNaN(left) ? 0 : left;1197 top = isNaN(top) ? 0 : top;1198 label.css('position', 'absolute')1199 .css('left', left)1200 .css('top', top + $(element).outerHeight());1201 1202 },1203 invalidHandler: function (ev, validator) {1204 var invalidHandler = $(form).data('invalid-handler');1205 if (invalidHandler)1206 invalidHandler(ev, validator);1207 },1208 ignore: ''1209 });1210 return validator.form();1211 }1212 return false;1213 };1214 1215 this.submitForm = function (form, callback, maskBody, invalidHandler) { //包含验证1216 if ($(form).data('beforesave') && (function () { eval($(form).data('beforesave')) }).apply(form) == false)1217 return;1218 if ($this.validateForm(form, invalidHandler))1219 $this.saveForm(form, callback, maskBody);1220 };1221 1222 this.saveForm = function (form, callback, maskBody, checkRule) {1223 var data = $this.getFormData(form);1224 data.checkRule = checkRule;1225 $.ajax({1226 url: DefaultUrl + 'Form/Edit',1227 data: data,1228 type: 'POST',1229 cache: false,1230 loadingScope: document.body,1231 success: function (r) {1232 if (r.result == 'SUCCESS') {1233 $(form).data('dirty', false);1234 if (window.localStorage)1235 require(['form.storage'], function (s) {1236 s.onsave(form);1237 });1238 if (callback)1239 callback(r);1240 }1241 else if (r.result) {1242 alert('《' + $(form).data('title') + '》保存失败：' + r.message);1243 }1244 else {1245 DCI.systemRule.showRuleDialog(r, function (dialogId) {1246 $this.saveForm(form, callback, maskBody, true);1247 });1248 }1249 },1250 error: function () {1251 alert('《' + $(form).data('title') + '》保存失败。');1252 }1253 });1254 };1255 1256 this.getFormData = function (form) {1257 var data = $this.getParams(form);1258 $this.getGridData(form); //子表1259 form.find('input:text,input:checkbox,input:radio,input:hidden,textarea').each(function (i, el) {1260 if ($(el).data('dirty') || $(el).data('submit')) {1261 var name = $(el).attr('name');1262 if (name) {1263 if ($(el).hasClass('datetime')) {1264 data['F[' + name + ']'] = $this.getElDateValue($(el));1265 }1266 else if ($(el).data('combobox')) {1267 var valueText = getComboBoxValueText($(el));1268 data['F[' + name + ']'] = valueText.value;1269 data['F[#' + name + ']'] = valueText.text;1270 }1271 else if ($(el).is(':radio')) {1272 data['F[' + $(el).data('name') + ']'] = $(el).val();1273 }1274 else if ($(el).data('getdata')) {1275 data['F[' + name + ']'] = $(el).data('getdata')();1276 }1277 else {1278 data['F[' + name + ']'] = $(el).val();1279 }1280 }1281 }1282 });1283 return data;1284 }1285 1286 this.getGridData = function (form) {1287 $(form).find('table').each(function (idx, tb) {1288 var container = $(tb).parents('.form-table');1289 var input = container.children('input[name]');1290 if (input.data('dirty')) {1291 var data = {1292 insert: [], update: [], del: [], idCol: 0, cols: []1293 };1294 var rowIdCol = -1; //行标识所在列1295 var sCol = []; //记录要提交的列1296 $(tb).find('colgroup col').each(function (idx, col) {1297 var colName = $(col).data('index');1298 if (colName) {1299 if (colName == 'IID')1300 rowIdCol = idx;1301 data.cols.push(colName);1302 sCol[idx] = true;1303 }1304 });1305 1306 $(tb).find('tr').each(function (idx, tr) {1307 if ($(tr).data('delete')) { //删除1308 var rowId = $(tr).find('td').eq(rowIdCol).text();1309 data.del.push(rowId);1310 }1311 else if ($(tr).data('insert')) { //插入1312 data.insert.push(getRowData(tr, sCol));1313 }1314 else if ($(tr).data('update')) { //更新1315 data.update.push(getRowData(tr, sCol));1316 }1317 });1318 1319 input.val(JSON.stringify(data));1320 }1321 });1322 1323 function getRowData(tr, sCol) {1324 var data = [];1325 $(tr).find('td').each(function (idx, el) {1326 if (sCol[idx]) {1327 var ipt = $(el).find('input');1328 if (ipt.length > 0) {1329 data.push(ipt.val())1330 }1331 else {1332 data.push($(el).text());1333 }1334 }1335 });1336 return data;1337 }1338 };1339 1340 function refreshGridRownum(table) {1341 var idx = -1;1342 $(table).find('colgroup:first col').each(function (i, e) {1343 if ($(e).data('type') == 'RowNumber') {1344 idx = i;1345 }1346 });1347 if (idx > -1) {1348 var rownum = 0;1349 $(table).find('tr').each(function (i, e) {1350 if (!$(e).data('delete'))1351 $(e).find('td').eq(idx).text(++rownum);1352 });1353 }1354 }1355 1356 this.getParams = function (form) {1357 var iid = form.data('iid');1358 var bimId = form.data('bimid');1359 var formId = form.data('formid');1360 var actId = form.data('actid');1361 var contextId = form.data('contextid');1362 var key = form.data('key');1363 return {1364 iid: iid, bimId: bimId, formId: formId, actId: actId, contextId: contextId, key: key1365 };1366 };1367 1368 this.showForm = function (data, callback, closeCallback, loadCallback) {1369 var fromName = "ShowForm";1370 if (data.fromName) fromName = data.fromName;//默认为ShowForm1371 data.key = data.contextId;1372 data.dialogId = 'Dialog_' + fromName;1373 var url = DefaultUrl + 'Form/Dialog_ShowForm';1374 showAjaxDialog(data.dialogId, url, data, true, document.body, function (state, data) {1375 if (state == 'ok') {1376 if (callback)1377 callback(data);1378 } else {1379 if (closeCallback)1380 closeCallback(data);1381 }1382 }, function (data, btn) {1383 var showform = $('#Dialog_' + fromName).find('form');1384 //if (!showform.data('readonly'))1385 $this.openFormCallback(showform);//初始化控件1386 if (loadCallback)1387 loadCallback(data)1388 //DCI.systemRule.showRuleDialog_Added(null, btn);1389 });1390 };1391 1392 this.showModifyFields = function (form) {1393 if ($(form).is(':visible') && !$(form).data('readmark-loaded')) {1394 $(form).data('readmark-loaded', true);1395 $(form).find('span.readMark').remove();1396 var b = $this.getParams(form);1397 $.ajax({1398 url: DefaultUrl + 'Form/GetModifyFields',1399 data: {1400 iid: b.iid, formId: b.formId1401 },1402 type: 'post',1403 loadingScope: document.body,1404 success: function (r) {1405 for (var i in r) {1406 var element = $this.getEl(form, r[i]);1407 if (element.length && element.is(':visible')) {1408 element.data('modified', true);1409 var el = element;1410 if (element.css('position') != 'absolute') {1411 var closest = element.parentsUntil('form');1412 for (var i = closest.length - 1; i >= 0; i--) {1413 if (closest.eq(i).css('position') == 'absolute') {1414 el = closest.eq(i);1415 break;1416 }1417 }1418 }1419 var left = parseFloat(el.css('left').substring(0, el.css('left').length - 2));1420 var top = parseFloat(el.css('top').substring(0, el.css('top').length - 2));1421 left = isNaN(left) ? 0 : left;1422 top = isNaN(top) ? 0 : top;1423 $('<span ></span>').css('position', 'absolute')1424 .css('left', left + el.outerWidth())1425 .css('top', top)1426 .appendTo($(form));1427 }1428 }1429 },1430 error: function () {1431 alert('修改痕迹获取失败。');1432 }1433 });1434 }1435 };1436 1437 this.removeModifyMark = function (form) {1438 $(form).data('readmark-loaded', false);1439 $(form).find('span.readMark').remove();1440 };1441 };1442 1443 window.toNumber = function (str) {1444 if (str)1445 return parseFloat(str);1446 return 0;1447 }1448 1449 window.roundFloat = function (number, digits) {1450 return Math.round(number * Math.pow(10, digits)) / Math.pow(10, digits);1451 }1452 1453 $(function () {1454 require(['css!form.style']);1455 require(['jquery.validate'], function () {1456 $.extend($.validator.messages, {1457 'required': '这是必填项'1458 });1459 $.validator.addMethod("pattern", function (value, element, param) {1460 if (!value) {1461 return true;1462 }1463 if (typeof param === "string") {1464 param = new RegExp("^(?:" + param + ")$");1465 }1466 return param.test(value);1467 }, "输入的格式不正确");1468 1469 $.validator.addMethod("datetime", function (value, element) {1470 if (!value)1471 return true;1472 var val = form_handler.getElDateValue($(element));1473 if (val) return true;1474 return false;1475 }, "日期时间不正确");1476 1477 $.validator.addMethod('MaxNumber', function (value, element, param) {1478 return compareNumber.call(this, value, element, param, function (a, b) {1479 if (isNaN(b) || !isNaN(a) && a <= b)1480 return true;1481 $(element).data('msg-MaxNumber', '请输入小于或等于' + b + '的数值');1482 return false;1483 });1484 }, function (param, element) {1485 return $(element).data('msg-MaxNumber');1486 });1487 1488 $.validator.addMethod('MinNumber', function (value, element, param) {1489 return compareNumber.call(this, value, element, param, function (a, b) {1490 if (isNaN(b) || !isNaN(a) && a >= b)1491 return true;1492 $(element).data('msg-MinNumber', '请输入大于或等于' + b + '的数值');1493 return false;1494 });1495 }, function (param, element) {1496 return $(element).data('msg-MinNumber');1497 });1498 1499 $.validator.addMethod('DecimalDigits', function (value, element, param) {1500 if (!value)1501 return true;1502 if (isNumber(value)) {1503 var len = 0;1504 var dotIdx = value.lastIndexOf('.');1505 if (dotIdx > -1) {1506 var digit = value.substr(dotIdx + 1);1507 var zEnd = 0;1508 for (var i = digit.length - 1; i >= 0; i--) {1509 if (digit[i] == '0') zEnd++;1510 else break;1511 }1512 len = digit.length - zEnd;1513 }1514 if (len <= param)1515 return true;1516 }1517 return false;1518 }, '请输入小数最多精确到{0}位的数值');1519 1520 $.validator.addMethod('MaxDatetime', function (value, element, param) {1521 return compareDateTime.call(this, value, element, param, function (a, b, str) {1522 if (b == 'Invalid Date' || a != 'Invalid Date' && a <= b)1523 return true;1524 $(element).data('msg-MaxDatetime', '请输入小于或等于' + str + '的日期时间');1525 });1526 }, function (param, element) {1527 return $(element).data('msg-MaxDatetime');1528 });1529 1530 $.validator.addMethod('MinDatetime', function (value, element, param) {1531 return compareDateTime.call(this, value, element, param, function (a, b, str) {1532 if (b == 'Invalid Date' || a != 'Invalid Date' && a >= b)1533 return true;1534 $(element).data('msg-MinDatetime', '请输入大于或等于' + str + '的日期时间');1535 });1536 }, function (param, element) {1537 return $(element).data('msg-MinDatetime');1538 });1539 1540 function isNumber(value) {1541 return /^[0-9]+(?:\.[0-9]+){0,1}$/.test(value);1542 }1543 1544 function compareNumber(value, element, param, fn) {1545 if (!value)1546 return true;1547 var n = isNumber(value) ? parseFloat(value) : NaN;1548 var n2 = NaN;1549 if (typeof param === 'number') {1550 n2 = param;1551 }1552 else if (typeof param === 'string') {1553 var m = /\$\[([^[\]]+)\]/.exec(param);1554 if (m) {1555 var form = $(element).closest('form');1556 var relVal = form_handler.getElValue(form, m[1]);1557 n2 = isNumber(relVal) ? parseFloat(relVal) : NaN;1558 }1559 }1560 return fn(n, n2);1561 }1562 1563 function compareDateTime(value, element, param, fn) {1564 if (!value)1565 return true;1566 var t = new Date(form_handler.getElDateValue($(element))), t2, str;1567 var m = /\$\[([^[\]]+)\]/.exec(param);1568 if (m) {1569 var form = $(element).closest('form');1570 var relEl = form_handler.getEl(form, m[1]);1571 t2 = new Date(form_handler.getElDateValue(relEl));1572 str = relEl.val();1573 }1574 else {1575 t2 = new Date(param);1576 str = form_handler.getFomatDate(t2, form_handler.getElDateFormat($(element)));1577 }1578 return fn(t, t2, str);1579 }1580 });1581 1582 $(document).on('mousedown', function (e) {1583 if ($(e.target).closest('.data-picker .dropdown-menu').length === 0) //下拉框1584 $('.form-content .data-picker>ul').hide();1585 if ($(e.target).closest('.PS-allPeopleList').length === 0) //人员选择框1586 $('.form-content .PS-allPeopleList').remove();1587 if ($(e.target).closest('.user-picker').length === 0)//人员筛选列表1588 $('.user-picker .user-picker-search-list').hide();1589 });1590 1591 $(document).on('click', '.form-content .data-picker>span,.form-content .data-picker>input.dropdown', null, function (e) {1592 var picker = $(e.currentTarget).closest('.data-picker');1593 var input = picker.find('input')1594 if (!input.attr('readonly')) {1595 picker.find('ul').show();1596 var val = input.val();1597 var ul = input.siblings('ul');1598 var lis = ul.find('li').removeClass('selected');1599 for (var i = 0; i < lis.length; i++) {1600 var li = lis.eq(i);1601 var text = li.text();1602 if (!val && !text || val == text) {1603 li.addClass('selected');1604 break;1605 }1606 }1607 }1608 });1609 1610 $(document).on('click', '.form-content .data-picker li', null, function (e) {1611 var picker = $(this).closest('.data-picker');1612 var input = picker.find('input');1613 if (!$(this).hasClass('selected'))1614 input.val($(this).text()).change();1615 var idxchange = input.data('indexchange');1616 if (idxchange) {1617 (function () {1618 eval(idxchange);1619 }).call(input);1620 }1621 picker.find('ul').hide();1622 });1623 });1624 }form.js
4.Grid控件的数据保存
Grid控件其实就是一个div，公司的一些页面表单都是动态生成的，表单上面的控件也是动态生成的，所有很多东西都是自己手写的。下面是Grid控件的结构。
<div class="FM000103-SBCLBJ form-table "> <input data-datagrid="true" data-formid="FM000034" name="SBCLBJ" type="hidden" /> <input data-param="init" type="hidden" value="{"ID":"$[ID]","IID":"$(autoid)"}" /> <input data-param="initsame" type="hidden" value="[]" /> <div class="form-table-header"> <div style="width:48px;"> 编辑 </div> <div style="width:50px;"> 序号 </div> <div style="width:60px;"> 是否上传 </div> <div style="width:380px;"> 申报材料内容 </div> <div style="width:80px;"> 备注 </div> </div> <div class="form-table-body"> <table class="table-hover"> <colgroup span="6"> <col width="48" /> <col width="50" data-type="RowNumber" /> <col width="0" data-type="Label" data-index="ID" class="hidden" /> <col width="0" data-type="Label" data-index="IID" class="hidden" /> <col width="60" data-type="CheckBox" data-index="CDZL" /> <col width="380" data-type="TextArea" data-index="ATDESC" /> <col width="80" data-type="TextArea" data-index="BZ" /> </colgroup> <tbody> <tr> <td class="form-table-edit"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></td> <td>1</td> <td class="hidden">BM00001141</td> <td class="hidden">4643</td> <td><input type="checkbox" value="1" checked="checked" /></td> <td>11111</td> <td>2222</td> </tr> <tr> <td class="form-table-edit"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></td> <td>2</td> <td class="hidden">BM00001141</td> <td class="hidden">4644</td> <td><input type="checkbox" value="0" /></td> <td>87789789789798789</td> <td>333</td> </tr> </tbody> </table> </div> <div class="form-table-footer"> <button type="button" class="btn add-row">新增</button> <button type="button" class="btn del-row">删除</button> </div> </div> 下面是完成Grid数据保存的js.
1 /** 2 * 功能：保存用户修改完form标签内容在LocalStorage中。 3 * 作者：黄金锋 (549387177@qq.com) 4 * 日期：2015-11-1 11:14:01 5 * 修改：2015-11-19 16:09:00 6 * 版本：version 3.0 7 */ 8 9 define(function () { 10 11 //从localStorage中加载数据 12 function onload(form) { 13 14 var fh = form_handler; 15 var p = fh.getParams(form); 16 if (!p.bimId || !p.formId || !p.iid) { 17 return; 18 } 19 var id = 'FORM_' + DCI.LoginUser.UserId + '_' + p.bimId + '_' + p.formId + '_' + p.iid; 20 21 var formDataDb; 22 var allControl = $(form).find("input:text[name],textarea[name]"); 23 24 //从本地取 25 var storage = localStorage.getItem(id); 26 if (storage != null) 27 { 28 if (confirm("是否加载缓存数据")) { 29 30 var myData = JSON.parse(storage); 31 allControl.each(function (i, e) { 32 var name = $(e).attr("name"); 33 if (myData[name] != null) { 34 $(e).val(myData[name]); 35 $(e).change(); 36 } 37 }); 38 } 39 } 40 41 var allGrid = $(form).find(".form-table"); 42 var formId = $(form).data("formid"); 43 var formStorage= localStorage.getItem("FORM_" + formId + "_isGridData"); 44 if (formStorage=="1") 45 { 46 if (confirm("是否加载Grid缓存数据")) 47 { 48 //给Grid控件赋值 49 allGrid.each(function (index, element) { 50 var formName = $(element).find("input:hidden[data-formid]").attr("name"); 51 var ipt = $(element).find("input[name]"); 52 var table = $(element).find("input:hidden[data-formid]").siblings(".form-table-body").find(".table-hover"); 53 var storageKey = "FORM_" + formId + "_" + formName; 54 var data = localStorage.getItem(storageKey); 55 var myData = JSON.parse(data); 56 if (myData != null) { 57 alert(data); 58 var InsertTotal = myData["Total"]["InsertTotal"]; 59 var DelTotal = myData["Total"]["DelTotal"]; 60 var UpdateTotal = myData["Total"]["UpdateTotal"]; 61 var trIIDIndex = myData["trIIDIndex"]["IID"]; 62 if (InsertTotal > 0) { 63 for (var i = 0; i < InsertTotal; i++) { 64 var tr = $('<tr></tr>'); 65 var row_data = myData["Insert"][i]; 66 table.find('colgroup col').each(function (idx, el) { 67 var td = $('<td></td>'); 68 if (idx == 0) { 69 td.append('<span aria-hidden="true"></span>'); 70 td.addClass('form-table-edit'); 71 } 72 else { 73 var index = $(el).data('index'); 74 var type = $(el).data('type') 75 if (type == "RowNumber") { 76 var val = row_data["RowNumber"]; 77 td.html(val); 78 } 79 if (type == "CheckBox") { 80 var val = row_data[index]; 81 td.append('<input type="checkbox" value="' + val + '" ' + (val == '1' ? 'checked="checked"' : '') + ' />'); 82 } 83 if (index && type != "CheckBox") { 84 td.html(row_data[index]); 85 } 86 } 87 if ($(el).attr('width') == '0') 88 td.addClass('hidden'); 89 td.appendTo(tr); 90 }); 91 //table.find("tbody").append(tr); 92 table.append(tr); 93 94 tr.data("insert", true); 95 ipt.change(); 96 } 97 } 98 99 if (UpdateTotal > 0) {100 101 for (var i = 0; i < UpdateTotal; i++) {102 var row_data = myData["Update"][i];103 var trIID = row_data["trIID"];104 var trIndex;105 table.find("tr").each(function (idx, ele)106 {107 var iid = $(ele).find("td").eq(trIIDIndex).html();108 if (iid == trIID) {109 trIndex = idx;110 }111 });112 113 var cells = table.find("tr").eq(trIndex);114 table.find('colgroup col').each(function (idx, el)115 {116 var index = $(el).data('index');117 if (index)118 {119 var td = cells.find("td").eq(idx);120 var type = $(el).data('type');121 var test =new Object();122 123 var text = row_data[index];124 125 if (type == 'CheckBox')126 {127 128 var ck = td.find('input[type="checkbox"]');129 if (text == '1')130 ck.prop('checked', true);131 else132 ck.prop('checked', false);133 }134 else135 {136 td.text(text);137 }138 }139 });140 cells.data("update", true);141 ipt.change();142 143 }144 }145 146 if (DelTotal > 0) {147 for (var i = 0; i < DelTotal; i++) {148 var row_data = myData["Del"][i];149 var trIID = row_data["trIID"];150 table.find("tr").each(function (idx,ele) {151 var iid = $(ele).find("td").eq(trIIDIndex).html();152 if ( iid== trIID)153 {154 $(this).css("display", "none");155 $(this).data("delete", true);156 ipt.change();157 }158 });159 160 }161 }162 163 164 }165 });166 }167 }168 169 170 171 //绑定change事件172 allControl.each(function (i, el) {173 var name = $(el).attr('name');174 if (name) {175 $(el).on('change', function () {176 onchange(this);177 });178 }179 });180 181 //保存修改的数据182 function onchange(el) {183 var storage = localStorage.getItem(id);184 if (storage == null) {185 formDataDb = new Object();186 var key = $(el).attr("name");187 var value = $(el).val();188 formDataDb[key] = value;189 localStorage.setItem(id, JSON.stringify(formDataDb));190 } else {191 var myData = JSON.parse(storage);192 var key = $(el).attr("name");193 var value = $(el).val();194 myData[key] = value;195 localStorage.setItem(id, JSON.stringify(myData));196 }197 }198 };199 200 //删除localStorage中的数据201 function onsave(form) {202 var fh = form_handler;203 var p = fh.getParams(form);204 var id = 'FORM_' + DCI.LoginUser.UserId + '_' + p.bimId + '_' + p.formId + '_' + p.iid;205 localStorage.removeItem(id);206 207 208 var allGrid = $(form).find(".form-table");209 var formId = $(form).data("formid");210 allGrid.each(function (index,element) {211 var formName = $(element).find("input:hidden[data-formid]").attr("name");212 var storageKey = "FORM_" + formId + "_" + formName;213 localStorage.removeItem(storageKey);214 });215 216 localStorage.setItem("FORM_" + formId + "_isGridData", null);217 }218 219 function ongridadd(form, table, data, tr) {220 var inputflag = table.closest("div .form-table").find("input:hidden[data-formid]")221 var storageKey;222 var formId = $(form).data("formid");;223 localStorage.setItem("FORM_" + formId + "_isGridData", "1");224 var RowNumber = table.find(".active").children().eq(1).html();225 var trIIDIndex;226 var trIID;227 table.find("col").each(function (idx, ele) {228 if ($(ele).data("index") == "IID") {229 trIID = table.find(".active").children().eq(idx).html();230 trIIDIndex = idx;231 }232 });233 var InsertObj = { trIID: trIID, RowNumber: RowNumber };234 235 var columnArr = table.children().find("[data-index]");236 if (columnArr) {237 columnArr.each(function (index, element) {238 var flag = $(element).data("index");239 InsertObj[flag] = data[flag];240 }); 241 }242 243 if (inputflag && trIID)244 {245 storageKey = "FORM_" + formId + "_" + inputflag.attr("name");246 //var mydata = "{'Insert':[{'trIID':'1','ID':'test','IID':'测试'},{'trIID':'2','ID':'test2','IID':'测试2'}],'Update':[{'trIID':'3','ID':'test3','IID':'测试3'},{'trIID':'4','ID':'test4','IID':'测试4'}],'Del':[{'trIID':'1'},{'trIID':'2'}]}";247 248 var getLocalStorage = localStorage.getItem(storageKey);249 if (getLocalStorage) {250 251 var dataObj = JSON.parse(getLocalStorage);252 var InsertTotal = dataObj["Total"]["InsertTotal"];253 254 dataObj["Insert"][InsertTotal] = InsertObj;255 dataObj["Total"]["InsertTotal"] = InsertTotal + 1;256 localStorage.setItem(storageKey, JSON.stringify(dataObj));257 258 } else259 {260 var mydata = { Total: { InsertTotal: 1, UpdateTotal: 0, DelTotal: 0 }, Insert: [InsertObj], Update: [], Del: [], Notes: { storageKey: storageKey }, trIIDIndex: { IID: trIIDIndex } };261 localStorage.setItem(storageKey, JSON.stringify(mydata));262 }263 }264 265 }266 267 function ongridedit(form, table, data, tr) {268 269 var inputflag = table.closest("div .form-table").find("input:hidden[data-formid]")270 var formId = $(form).data("formid");271 var storageKey = "FORM_" + formId + "_" + inputflag.attr("name");272 localStorage.setItem("FORM_" + formId + "_isGridData", "1");273 var mySourceData = {};274 var trIIDIndex;275 table.find("col").each(function (idx, ele)276 {277 var index = $(ele).data("index");278 var type = $(ele).data("type");279 if (index)280 {281 if (type == "CheckBox")282 {283 var val = table.find(".active").children().eq(idx).html();284 var value =$(val).val();285 mySourceData[index] = value;286 }287 else288 {289 if (index == "IID")290 {291 trIIDIndex = idx;292 }293 mySourceData[index] = table.find(".active").children().eq(idx).html();294 }295 }296 });297 298 var trIID = mySourceData["IID"];299 var UpdateObj = { trIID: trIID };300 $.extend(UpdateObj, mySourceData);301 302 var getLocalStorage = localStorage.getItem(storageKey);303 if (getLocalStorage)304 {305 var dataObj = JSON.parse(getLocalStorage);306 var InsertTotal = dataObj["Total"]["InsertTotal"];307 var UpdateTotal = dataObj["Total"]["UpdateTotal"];308 309 310 311 if (InsertTotal > 0)//新增后在编辑312 {313 for (var i = 0; i < InsertTotal; i++) {314 var row_data = dataObj["Insert"][i];315 if (row_data["trIID"] == trIID) {316 $.extend(dataObj["Insert"][i], UpdateObj);317 }318 }319 }320 321 if (UpdateTotal > 0)//编辑之后在编辑322 {323 for (var i = 0; i < UpdateTotal; i++) {324 var row_data = dataObj["Update"][i];325 if (row_data["trIID"] == trIID) {326 $.extend(dataObj["Update"][i], UpdateObj);327 }328 }329 }330 331 var UpdateTotal = dataObj["Total"]["UpdateTotal"];332 dataObj["Update"][UpdateTotal] = UpdateObj;333 dataObj["Total"]["UpdateTotal"] = UpdateTotal + 1;334 335 336 localStorage.setItem(storageKey, JSON.stringify(dataObj));337 }338 else339 {340 341 var mydata = { Total: { InsertTotal: 0, UpdateTotal: 1, DelTotal: 0 }, Insert: [], Update: [UpdateObj], Del: [], Notes: { storageKey: storageKey }, trIIDIndex: { IID: trIIDIndex } };342 localStorage.setItem(storageKey, JSON.stringify(mydata));343 }344 345 346 var testdata = localStorage.getItem(storageKey);347 var myData = JSON.parse(testdata);348 if (testdata != null) {349 alert(testdata);350 //alert(mydata);351 //alert(myData["Total"]["InsertTotal"]);352 //alert(myData["Insert"][0]["ID"]);353 }354 }355 356 function ongriddel(form, table, tr) {357 var inputflag = table.closest("div .form-table").find("input:hidden[data-formid]")358 var formId = $(form).data("formid");359 var storageKey = "FORM_" + formId + "_" + inputflag.attr("name");;360 localStorage.setItem("FORM_" + formId + "_isGridData", "1");361 var trIIDIndex;362 var trIID;363 table.find("col").each(function (idx, ele) {364 if ($(ele).data("index") == "IID")365 {366 trIIDIndex = idx;367 trIID = tr.find("td").eq(idx).html();368 }369 });370 371 var DelObj = { trIID: trIID };372 373 var getLocalStorage = localStorage.getItem(storageKey);374 if (getLocalStorage) {375 376 var dataObj = JSON.parse(getLocalStorage);377 var isInsertData = false;378 var isUpdateDel = false;379 var InsertTotal = dataObj["Total"]["InsertTotal"];380 var DelTotal = dataObj["Total"]["DelTotal"];381 var UpdateTotal = dataObj["Total"]["UpdateTotal"];382 383 384 if (InsertTotal > 0) {385 386 for (var i = 0; i < InsertTotal; i++) {387 var row_data = dataObj["Insert"][i];388 if (row_data["trIID"] == trIID) {389 isInsertData = true;390 dataObj["Insert"][i] = null;391 }392 }393 }394 395 if (UpdateTotal>0)396 {397 for (var i = 0; i < UpdateTotal; i++) {398 var row_data = dataObj["Update"][i];399 if (row_data["trIID"] == trIID) {400 isUpdateDel = true;401 dataObj["Update"][i] = null;402 }403 }404 }405 406 407 if (isInsertData)408 {409 var tempArr = [];410 for (var i = 0; i < InsertTotal; i++) {411 if (dataObj["Insert"][i] != null) {412 tempArr[i]=dataObj["Insert"][i];413 }414 }415 416 dataObj["Insert"] = tempArr;417 dataObj["Total"]["InsertTotal"] = InsertTotal - 1;418 }419 else420 {421 422 if (isUpdateDel)423 {424 var tempArr = [];425 for (var i = 0; i < InsertTotal; i++) {426 if (dataObj["Update"][i] != null) {427 tempArr[i] = dataObj["Update"][i];428 }429 }430 431 dataObj["Update"] = tempArr;432 dataObj["Total"]["UpdateTotal"] = UpdateTotal - 1;433 434 } 435 436 dataObj["Del"][DelTotal] = DelObj;437 dataObj["Total"]["DelTotal"] = DelTotal + 1;438 439 }440 441 localStorage.setItem(storageKey, JSON.stringify(dataObj));442 if (dataObj["Total"]["InsertTotal"] == 0 && dataObj["Total"]["UpdateTotal"] == 0 && dataObj["Total"]["DelTotal"] == 0)443 {444 localStorage.setItem("FORM_" + formId + "_isGridData", null);445 }446 447 448 } else449 {450 var mydata = { Total: { InsertTotal: 0, UpdateTotal: 0, DelTotal: 1 }, Insert: [], Update: [], Del: [DelObj], Notes: { storageKey: storageKey }, trIIDIndex: { IID: trIIDIndex } };451 localStorage.setItem(storageKey, JSON.stringify(mydata));452 }453 454 }455 456 return {457 onload: onload,458 onsave: onsave,459 ongridadd: ongridadd,460 ongridedit: ongridedit,461 ongriddel: ongriddel462 }463 });
原标题：HTML5 LocalStorage 本地存储
关键词：HTML
我知道了 