教程总目录
上一节：JBolt平台开发入门(5)-组件自动化-富文本编辑器
在JBolt开发平台中，定义了四种常见的Layout布局，分别是：
1、Pjax加载的列表查询管理类
2、Pjax加载的Form表单单页
3、一个页面内弹出的Dialog中的表单
4、一个页面内弹出的Dialog中的列表查询
一、Pjax加载的列表查询管理类
列表查询与管理
这个布局在JBolt中使用的是__admin_layout.html这个布局
__admin_layout.html
使用方式：
使用方式代码演示
这样就可以轻松做出此类布局。
二、Pjax加载的Form表单单页
表单单页版布局
就是一个界面pjax加载过来的，就是一个表单。
再来看另一个例子：
其他JBolt开发的项目中的单页表单
单页表单例子
可以好几个步骤切换的表单
这个布局在JBolt中使用的是__admin_layout.html这个布局和表单提交自动化的封装_formjs.html
无需写任何JS 完成表单的校验和提交
无需写任何JS 完成表单的校验和提交
代码演示
三、一个页面内弹出的Dialog中的表单
凡是在Dialog里出现的布局都使用下面这个layout：
dialog中的布局
常见的管理列表界面里都有增删改查操作，其中增加新数据和修改数据都用到了表单，可能使用进入单页的表单，也可以使用Dialog里的表单去处理
JBolt中普通的管理列表中的增加和编辑都是用的dialog表单实现的。
Dialog表单
这里点击新增和修改按钮，会弹出一个Dialog，加载一个表单页面，点击确定按钮后这个表单会提交。
这里用到好几个组件，首先这些点击触发dialog弹出的按钮，无需JS，只要绑定data-dialogbtn的属性 配置几个url地址title之类的就可以了。
其次就是加载表单页面的布局了。
Dialog中的表单
这样，即使你是在Dialog中使用表单，也是使用跟第二个里面的布局一样的，同样需要引入封装的_formjs.html
form.html的代码
只要dialog的确定按钮点击，就会按照_formjs.html里的封装去处理数据的自动校验和提交的，很省事儿的。
再举一个例子：JBolt中的角色上分配权限
角色分配权限表单
这个也是使用的这种dialog里的form提交数据
具体拿到JBolt代码的可以看这个代码
分配权限表单
还有一个就是弹出的Dialog中放富文本的例子：都是一样的布局
dialog表单-富文本
四、一个页面内弹出的Dialog中的列表查询
经常会有一些子表数据和关联数据会通过dialog列表查询方式显示。
关联子数据的列表查询和管理布局
代码位置可以在这里找到
代码位置
使用的是
dialog中的列表管理查询
有的需要分页 有的不需要的就不用
分页也是封装到了起来，只要你页面里加入两行引用就搞定了，无需自己写任何其他js
分页
这里的几个参数，无非就是定义分页组件box的ID 分页组件点了提交哪个Form，指定一下formID是谁，就完了。
布局代码样例
