DWZ HTML扩展
来源:互联网 发布:mac装windows 编辑:程序博客网 时间:2024/05/21 08:59
一:Tree 扩展
<ul class="tree [treeFolder treeCheck [expand|collapse]]"oncheck="kkk">
<li><ahref="#"target="navTab"rel="main"tname="name"tvalue="value"checked="true">第一级菜单项 A</a>
<ul>
<li><ahref="#"target="dialog"rel="dialog1"tname="name"tvalue="value"checked="true">第二级菜单项 A</a></li>
<li><ahref="#">第二级菜单项 B</a></li>
<li><ahref="#">第二级菜单项 C</a>
<ul>
<li><ahref="#">第三级菜单项 A</a></li>
<li><ahref="#">第三级菜单项 B</a></li>
</ul>
</li>
</ul>
</li>
<li><ahref="#">第一级菜单项 B</a></li>
</ul>
1、树结构是按照<ul><li>嵌套的,将最顶级的<ul>以class=”tree”标识即可。
2、 treeFolder, treeCheck, expand|collapse则为可选的,treeFolder:在所有树节点前加上Icon图标,treeCheck:在所有树节点前加上checkbox,此时需要在<a> 加上三个
扩展属性tname=””, tvalue=””, checked, 其中tname与tvalue对应该checkbox的name 与value属性, checked表示checkbox的默认状态是否checked.
3、expand与collapse:expand表示树的所有第一级节点默认是展开状态,collapse则表示所有第一级节点默认为折叠状态,当expand与collapse都没有时默认则会展开第一个节点。
4、扩展属性oncheck是自定义函数, 用来接收点击checkbox时返回值, 当点击非子树节点checkbox时返回数据格式为:
{checked:true|false,items:{name:name, value:value}}, 当点击了树节点checkbox时, 此子树节点下所有的checkbox都将选中, 同时返回
此子树节点下所有的checkbox的值, 格式为{checked:true|false, items:{{name:name, value:value}, {name:name, value:value}……}} 。
二:Panel 扩展
<div class="panel [close collapse]" [defH="200"|minH=”100”]>
<h1>标题</h1>
<div>
内容
</div>
</div>
顶层div 以class=”panel”标识即可, 其中的<h1>为panel的标题, <h1>后的<div>则是放置内容的容器.
Class 中的close 与collapse为可选项, close表示panel默认为关闭状态, 没有则默认为打开状态. collapse 再表示此panel是否为可折叠的panel, 没有则
此panel不可折叠. 扩展属性defH则表示panel 内容部分的固定高度, 没有则panel内容部分的高度为实际内容的高度, minH可以指定panel内容部分的最小高度.
三:日志控件
<input type="text"name="xxx"class="date" [pattern="yyyy-MM-dd"] [yearstart="-80"] [yearend="5"]/>
日期格式:
* Field | Full Form | Short Form
* -------------+--------------------+-----------------------
* Year | yyyy (4 digits) |yy(2 digits),y (2 or4digits)
* Month | MMM (name orabbr.)|MM(2 digits),M (1 or2digits)
* |NNN(abbr.) |
* Day of Month|dd(2 digits) | d (1or2digits)
* Day of Week |EE(name) |E (abbr)
* Hour (1-12) | hh (2digits) |h(1 or 2digits)
* Hour (0-23) | HH (2digits) |H(1 or 2digits)
* Hour (0-11) | KK (2digits) |K(1 or 2digits)
* Hour (1-24) | kk (2digits) |k(1 or 2digits)
* Minute | mm (2 digits) |m(1 or 2digits)
* Second | ss (2 digits) |s(1 or 2digits)
* AM/PM | a |
示例:
<p>
<label>默认格式:</label>
<inputtype="text"name="date1"class="date"/>
<aclass="inputDateButton"href="#">选择</a>
</p>
<p>
<label>定义年份:</label>
<inputtype="text"name="date2"class="date"yearstart="-80"yearend="5"/>
<aclass="inputDateButton"href="#">选择</a>
</p>
<p>
<label>自定义日期格式:</label>
<inputtype="text"name="date3"class="date"pattern="yyyy/MM/dd"/>
<aclass="inputDateButton"href="#">选择</a>
</p>
<p>
<label>自定义日期格式:</label>
<inputtype="text"name="date5"class="date"pattern="dd/MM/yy"/>
<aclass="inputDateButton"href="#">选择</a>
</p>
<p>
<label>自定义日期+时间:</label>
<inputtype="text"name="date7"class="date"pattern="yyyy年MM月dd日 HH:mm:ss" />
<aclass="inputDateButton"href="#">选择</a>
</p>
<p>
<label>自定义日期+时间:</label>
<inputtype="text"name="date8"class="date"pattern="yyyy年MM月dd日 HH:mm" />
<aclass="inputDateButton"href="#">选择</a>
</p>
<p>
<label>自定义日期+时间:</label>
<inputtype="text"name="date9"class="date"pattern="y年M月d日HH点"/>
<aclass="inputDateButton"href="#">选择</a>
</p>
四:url变量变换
HTML扩展方式nabTab,dialog,nabTabTodo的url支持变量替换。例如:__URL__/edit/id/{xxx}大括号内的xxx就是变量名,主要功能
是结合table组件一起使用,
删除、编辑、修改密码使用了变量{sid_user}
<tbody>中的<tr target={sid_user} rel={$vo['id']}/>
当选中一行时,tr上的rel值会自动替换到url变量中.
注意url变量名{sid_user}和tr的target="sid_user"保持一致.
代码示例:
<aclass="delete"href="__URL__/foreverdelete/id/{sid_user}/navTabId/__MODULE__"target="navTabTodo"title="你确定要删除
吗?"warn="请选择用户"><span>删除</span></a>
<aclass="edit"href="__URL__/edit/id/{sid_user}"target="dialog"mask="true"warn="请选择用户"><span>编辑</span></a>
<aclass="icon"href="__URL__/password/id/{sid_user}"target="dialog"mask="true"warn="请选择用户"><span>修改密码</span></a>
<tableclass="list"width="100%"layoutH="116">
<thead>
<tr>
<thwidth="60">编号</th>
<thwidth="100">用户名</th>
<th>昵称</th>
<th>Email</th>
<thwidth="100">添加时间</th>
<thwidth="120">上次登录</th>
<thwidth="80">登录次数</th>
<thwidth="80">状态</th>
</tr>
</thead>
<tbody>
<volistid="vo"name="list">
<trtarget="sid_user"rel="{$vo['id']}">
<td>{$vo['id']}</td>
<td>{$vo['account']}</td>
<td>{$vo['nickname']}</td>
<td>{$vo['email']}</td>
<td>{$vo['create_time']|date="Y-m-d",###}</td>
<td>{$vo['last_login_time']|date="Y-m-d H:i:s",###}</td>
<td>{$vo['login_count']}</td>
<td>{$vo['status']|showStatus=$vo['id']}</td>
</tr>
</volist>
</tbody>
</table>
- DWZ HTML扩展
- YII+DWZ扩展
- DWZ的Tree扩展
- DWZ (JUI) 403状态扩展
- DWZ富框架扩展icon方式
- dwz笔记之tree权限扩展
- dwz....
- dwz
- DWZ
- DWZ
- DWZ
- dwz富客户端框架列表checkbox功能扩展
- DWZ (JUI)表格Table多选selectedTodo功能扩展
- DWZ (JUI)表格Table单击选中功能扩展
- MVC @Html 扩展方法
- MVC @Html 扩展方法
- Chrome扩展:Run Selected HTML
- Extjs4.2 Html 编辑器扩展
- 自定义Dialog悬浮实现登录框
- Delphi中点击网页弹出的Alert对话框的确定按钮
- 浅谈java内存模型
- javascript--DOM
- JUnit3 与 JUnit4 的区别
- DWZ HTML扩展
- TWebBrowser禁止弹出Alert对话框
- iOS中的下拉刷新SVPullToRefresh
- resin下webapps路径无法删除问题(自动恢复)
- 触发式电子邮件营销 掌握秘诀出奇制胜
- Delphi处理TWebBrowser的Close事件
- js数组的操作(转)
- 运动估计和运动补偿
- Delphi获取所有打开的IE窗口的网页源码