已经完成 初版 Easyui Tag 标签的开发、以下是已经支持的标签:
- 基本标签:RenderSection、Section、Resources、Resource、Hidden;
- EasyUI 基础:Pagination、ProgressBar、SearchBox、Tooltip;
- EasyUI 布局:Body、Panel、Tabs(TagPage)、Accordion(Sheet)、Layout(Dock);
- EasyUI 窗口:Window、Dialog;
- EasyUI 表格与树:DataGrid(Columns、Column)、DataList、Tree、TreeGrid、PropertyGrid;
- EasyUI 表单:Form、ValidateBox、TextBox、Combo、ComboBox、ComboTree、ComboGrid、NumberBox、DateBox、DateTimeBox、DateTimeSpinner、Calendar、NumberSpinner、TimeSpinner、Slider、FileBox;
- EasyUI 菜单与按钮:Menu(MenuItem、SubItem)、LinkButton、MenuButton、SplitButton、SwitchButton;
<%@ taglib prefix="k" uri="http://www.kayura.org/tags/jeasyui"%>以下是将会用到的一些标签:
- RenderSection、Section 用于 jsp 模板页的开发。
- Resources、Resource 用于导入 js 与 css 资源;
- Body 页面级的布局标签;
- Layout 局部布局标签、Dock 布局中的块;
<k:section name="title">数据词典管理</k:section> <k:section name="head"> </k:section>
<k:section name="body"> <k:form id="ff" url="${root}/admin/dict/save.json" success="function(data){ juasp.closeWin(1) }"> <k:hidden id="id" value="${model.id}" /> <k:hidden id="dictId" value="${model.dictId}" /> <k:hidden id="parentId" value="${model.parentId}" />
<c:if test="${treeType}"> </c:if>所属词典: | ${model.dictName} |
上级词典: | ${model.parentName} |
词典名称: | <k:textbox name="name" width="180px" value="${model.name}" required="true" validType='length[1,32]' /> |
词典值: | <k:textbox name="value" width="180px" value="${model.value}" required="true" validType='length[1,1024]' /> |
排序值: | <k:numberbox name="serial" style="width:180px" value="${model.serial}" required="true" min="0" precision="0" /> |
<k:section name="tool"> <k:linkbutton style="width:80px" iconCls="icon-ok" onClick="$('#ff').form('submit')" text="提交" /> <k:linkbutton style="width:80px" iconCls="icon-cancel" onClick="juasp.closeWin(0)" text="取消" /> </k:section>
<%@ include file="/views/shared/_dialog.jsp"%>
<h2>最终显示效果</h2>
<img class="alignnone wp-image-50" src="http://kayura.org/blog/wp-content/uploads/2016/03/编辑页面示例-300x180.jpg" alt="编辑页面示例" width="413" height="248" />
使用模板页,可以更多容易的控制页面的布局,让开发者更关系业务表单的内容。
标签库 Github 地址:<a href="https://github.com/KayuraTeam/kayura-tags" target="_blank">https://github.com/KayuraTeam/kayura-tags</a>