JBolt开发平台入门(22)-JBolt平台提供的多种Form

教程总目录

上一节： JBolt开发平台入门(21)-AutoSelect+select2+多选+隐藏域的高级用法

一行代码搞定Form提交，带校验，自适应ajax提交、Portal提交，多选项卡和单页模式自适应提交。
JBolt里提交Form表单有好几种方式可选。

编辑器案例

案例-在Demo模块找Neditor.html的demo页面中有好几种提交方式

1、Ajax方式提交，使用的是jquery.form.js

ajax方式提交

这种是一个按钮点击，提交指定ID的form表单。 具体封装在了jbolt-admin.js里

2、Dialog中表单提交-Ajax

Dialog中的Form

在JBolt的CURD操作中 添加数据常用DIalog，Dialog上有确定按钮，点击确定按钮，提交dialog中的表单，表单提交用的是ajax提交，同方式1一样，也是使用了jquery.form.js 底层调用的都是。
具体封装在了_formjs.html

3、pageFormSubmit 直接表单提交

这个在JBolt里不是特殊需要一般不适用，因为这个是直接form提交跳转页面的，在单页模式下需要单页大表单的时候，使用这种。

案例

比如这种一个表单内容很多，分成了好几个步骤跳转页面去挨个步骤添加数据，保存数据的过程，就用这种。
当然这种体验就是页面直接跳转了，其实这里也能优化，点击下一步按钮后，先ajaxSubmit返回成功信息后，js控制进入下一步页面的跳转。

4、submitFormInCurrentTab 执行表单提交的时候在多选项卡模式下

Form表单直接提交会整个页面刷新的，所以在多选项卡模式先推荐使用ajax方式提交表单，但是如果也分步骤了，比如在电商模块中添加商品的流程，分了好几步。
在Neditor.html的demo中也有案例，点击提交按钮，刷新的是当前正在显示的选项卡的内容区域，局部提交刷新跳转，而不是整体。

点击提交，tab内部刷新跳转 跳转后的样子

各自根据自己业务需要，选择合适的使用即可。