artemplate的自动保存问题
来源:互联网 发布:蓝点网络 编辑:程序博客网 时间:2024/04/28 01:42
artemplate作为前端模板,简洁,高效,兼容程度高。
但在数据输入时,不能非常高效地收集用户的数据数据。
这里提供了一种高效的数据自动收集方法,其主要原理是:
每一个 input 的 name 和 value 构成一组 key-value值。
其中key可以是一组用点号:"."分割的路径,写入值时,按照name指定的路径反向写到对象上即可。
function SetDataValue(name, value, nowData) { if (!name || name.length == 0) return; var spN = name.split('.'); var names = []; for (var i = 0; i < spN.length; i++) {//去掉空字符 var sn = spN[i]; if (sn.length > 0) names.push(sn); } var ObjT = nowData; for (var i = 0; i < names.length - 1; i++) { var n = names[i]; if (!ObjT[n]) { ObjT[n] = {}; } ObjT = ObjT[n]; } ObjT[names[names.length - 1]] = value; } //收集一个容器下所有的input值,以key-value方式赋值到obj上 WorkArea.prototype.collectValues = function (nowData) { var err = this.DoSaveCall(); if (err) { var info = err.toString(); this.CB.FireEvent('onError', info); return info; } var inps = this.WA.getElementsByTagName('input'); for (var i = 0; i < inps.length; i++) { var inpt = inps[i]; SetDataValue(inpt.name, inpt.value, nowData); } var inps = this.WA.getElementsByTagName('textarea'); for (var i = 0; i < inps.length; i++) { var inpt = inps[i]; SetDataValue(inpt.name, inpt.value, nowData); } var inps = this.WA.getElementsByTagName('select'); for (var i = 0; i < inps.length; i++) { var inpt = inps[i]; var index = inpt.selectedIndex; if (index >= 0) { var value = inpt.options[index].value; SetDataValue(inpt.name, value, nowData); } else { SetDataValue(inpt.name, null, nowData); } } }
其中 this.WA 是模板的显示容器,即渲染后 innerHTML写到的div.
nowData是input内容需要输出到的对象。
模板定义需要如下形式:
<div style="line-height:38px;"> 名称: <input name="SVRData.Name" type="text" style="width:200px;" value="{{SVRData.Name}}" /> <label style="padding-left:100px;"></label> 默认显示模板:<label id="temIDName"></label><input type="button" style="width:100px;margin-left:20px;" value="选择" /> <br /> 助记名: <input name="SVRData.namespace" type="text" style="width:500px;" value="{{SVRData.namespace}}" /> <br />Json默认值: <br /> <textarea name="SVRData.Json" cols="100" rows="22">{{JsonString}}</textarea> </div>
每个input的name需要与渲染对象上的路径相同。
0 0
- artemplate的自动保存问题
- VS code 保存时自动格式化的问题
- UEditor的自动保存
- eclipse保存时自动去除tab的问题(光标自动到最前面)
- Altium Designer的自动保存
- emacs的自动保存功能
- Sublime Text3自动保存的功能(失去焦点自动保存)
- foxmail新建联系人保存时邮件地址自动改变(保存后不是自己填写的邮件地址)的问题
- PHP 解决浏览器自动填充保存的账号和密码的问题
- 保存按钮的问题
- 导出到excel,如果不保存,会自动关闭页面的问题
- Ueditor(三):解决1.4版本中取消自动保存不成功的问题
- 自动保存
- 自动生成可以保存数据的HTML
- TTreeview如何保存自动删除的对象
- 自动保存程序的设计与实现
- 关掉或禁用wordpress的自动保存
- ajax自动保存用户的输入
- MFC使用WM_HOTKEY添加快捷键
- 实现图片Bitmap简单编辑的三种方式
- JNI:Java Native Interface
- 纹理CCTexture2D和精灵CCSprite
- [Nginx, Django]Securing connections with SSL
- artemplate的自动保存问题
- 深度学习(七)caffe源码c++学习笔记
- 不必成为什么
- linux bind()遇到Address already in use问题
- hdu 3084 How Many Answers Are Wrong【带权并查集】
- Android LayoutInflater详解
- RHCE 学习笔记(16) - KickStart
- HTML代码转换编辑器
- HDOJ 2046 骨牌铺方格