本章屬於該系列的高級部分，將介紹表單中一些列的配置
1、config列的配置：
主要用於控制布局 ：config:{autoLayout:true|'1,2,2,4'}
true:根據配置項最裡層的數量來自動使用不同的柵格，
'1,2,2,4':使用指定的柵格來布局，如果配置的列數不足的情況將使用第一項(n,n 為一項)
2、hides的配置項
hides:[{id:'xxx',value:''}]
此項是可選的，主要用於編輯時存放一些不可見的列(如主鍵ID的值)
3、eles 表單元素的配置(重點)
eles的配置支持2中情況，一種是分組的情況，另外一種是非分組的情況，
eles:[[],[]] //非分組的情況，使用交叉數組存放配置列，我暫且把裡層的數組稱為組配置項，把組裡面的配置項稱為元素配置項
eles:{'groupName':[]} //分組的情況，使用json對象來存放
組配置項裡層就是單個的元素配置項了，[{ele:{id:'',name:''}}]
細心的博友發現為什麼要在元素配置項裡面多此一舉加一個ele，然後再ele裡面存放元素的屬性，而不是直接放在元素配置項裡面呢
當然是考慮到以後的擴展性，其實元素配置項的完整寫法是:{label:{},ele:{}}
A、label：即表達元素前面的提示字符，label裡面的配置項：{target:'#contain.id',className:'col-sm-2',text:'#contain.title'}
target：for的元素，默認為ele的id， className：改label上應用的class， text:顯示在label中的文字，默認為ele中的title,如果ele中配置了required：true 還將會在label裡層生成一個<span> 用來做校驗的提示
B、ele:即真正表達元素的配置
{
type:'',id:'',name:'',value:'',className:'col-sm-4',
readonly:false,disable:false,extendAttr:{key:value},required:false,
render:'',
prev:{type:'button',iconClassName:'',ele{render:''}},
next:{iconClassName:'',ele{render:''}},
}
type:目前支持 text(默認)、select、radio、checkbox、textarea、datetime、search
note:當為select、radio、checkbox的時候，需要為該項設置數據源，items:[{text:'',value:'',select:'可選'}]
select:withNull:true,將會在數據源的基礎上加多一些 --請選擇-- 空項
checkbox:items裡面的配置項可以有id、和name及select
render:''，html標簽，優先級最高，當為該項設置了其他配置無效，如：render:'<input type="file" name="" id="" />'
另外針對pre和next也同樣適用,pre：{ele:{render:''}}
pre：用於為元素配置特性選項，
如{ele:{pre:{text:'<input type="radio">'},type:'text',name:'DisplayName',title:'顯示名稱:'}} 該配置項為元素前面配置了一個單選框
效果圖：
可以支持前後同時配置，詳情請參照：第一章支持的簡單類型
className：改表單元素適用的class, className:'col-sm-4'
readonly:false,disable:false 用於設置元素的狀態disable、readonly
value：設置元素的默認值
extendAttr:{key:value} 鍵值對形式，僅支持html5的data-會在元素上生成data-的前綴
demo: extendAttr:{select:true} 會在元素上生成一個data-select=true 的擴展屬性
組表單配置：'組名':[]
demo： '個人信息':[{},{}]
以上所述是小編給大家介紹的BootStrap智能表單實戰系列(八)表單配置json詳解的全部敘述，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對網站的支持！