一般动作
登录
Wiki: BROPEN ▼: Document Index
»
Space: FAQ ▼: Document Index
»
Page: 如何在表单视图操作栏上配置一个自定义按钮
搜索
zh
页面动作
导出 ▼: 以PDF格式导出 以RTF格式导出 以HTML格式导出
更多动作 ▼: 打印预览 察看源码
欢迎进入Wiki » FAQ » 如何在表单视图操作栏上配置一个自定义按钮?

# 如何在表单视图操作栏上配置一个自定义按钮?

在2014-05-17 11:50上被李小翔修改
评论 (0) · 附件 (0) · 记录 · 信息

通过脚手架模板生成视图后，在show、edit视图中，会生成一个默认的操作栏，里面包含常见的编辑、保存、删除等操作，如：
<div class="buttons">
<span class="button"><g:actionSubmit class="save" action="update" value=".." onclick=".." /></span>
......
</div>

添加自定义的按钮，只需要：

1. 选择一个大小、风格一致的图标，放到 web-app/images 文件夹下，并在工程的 form.css 或 body.css 样式表文件中新建一个css类，如：
   .buttons input.save {
   background: transparent url(../images/icons/24x24/table_save.png) 5px 50% no-repeat;
   }
   此外，BroFramework的 buttons.css 和 buttons24.css 中已经定义了很多样式，也可以直接使用。
2. 如果按钮要提交给后台的action，可以在上面的操作栏 div 内添加 span 和 g:actionSubmit 标签（直接从脚手架生成的代码中复制一个），将 class 属性修改为1中新建的css类名、action 属性修改为后台action名，同时修改 value 属性为显示名（如“保存”）即可。
   如果提交给后台前要做一些表单验证之类的操作，可以编写 onclick 事件。
3. 如果按钮并不是要马上提交到后台，而是要执行一些js代码，则可以使用下面的代码来插入操作：
   <span class="button"><input class="preview" type="button" onclick="......" value="测试按钮" ></span>

BTW：可以通过 BroModeler 来给业务流程的表单配置自定义按钮并设置显示条件。

标签： BroFramework
在2014-05-17 11:50上被李小翔创建

- 评论 （0）
- 附件 （0）
- 记录
- 信息

# 快速链接

- 首页
- 新闻动态
- FAQ

Copyright © 2013 北京博瑞开源软件有限公司
京ICP备12048974号