管理後臺作為資料維護管理的中心，資料前後端的校驗一定是不可缺少的。比較jquery validation與bootstrap validation之後，決定用bootstrap進行校驗。區別：一是框架本身採用bootstrap佈局，二是日期校驗，日期控制元件採用bootstrap-datepicker.min.js,與bootstrap validation 結合比較好，三是樣式相對好一些，寫法基本相似。
具體寫法：

引入

在原有的main.css中加入：has-warning，has-error 部分的樣式。如果並沒有用到這個框架，直接引用bootstrap.css 的樣式就可以了

先來一個校驗的例子：

<input id="name" name="name" class="form-control" type="text" placeholder="請輸入姓名" required data-bv-notempty-message="姓名不能為空" pattern="^[a-zA-Z0-9]+$" data-bv-regexp-message="姓名由數字字母組成" data-bv-stringlength="true" data-bv-stringlength-min="3" data-bv-stringlength-max="15" data-bv
 
-stringlength-message="姓名3-15位">

required 要求必填
data-bv-notempty-message 必填的提示資訊
pattern 校驗的正則表示式
data-bv-regexp-message 不滿足正則表示式的訊息
data-bv-stringlength 要求長度 最小3，最大15及提示資訊

<input class="form-control" placeholder="請輸入Email地址"  name="email" type="email" data-bv-emailaddress-message="請輸入有效的電子郵件地址"
 
 />

複選框例子

<input class="form-check-input" type="checkbox" name="protrol" required data-bv-message="使用者協議必須選擇" >我同意****

如果是日期型別，<div class="div-form-control" ><input class="form-control" id="demoDate" type="text" name="demoDate" required placeholder="請選擇日期" required data-bv-notempty-message="日期不能為空"></div>
日期型別不會在選擇日期後自動校驗結果，需要增加程式碼：

$('#demoDate').datepicker({
        format: "yyyy-mm-dd",
        autoclose: true,
        todayHighlight: true
      }).on('hide',function(e) {                
                $('#registerForm').data('bootstrapValidator')
                    .updateStatus('demoDate', 'Valid')
                    .validateField('demoDate');                 
            });

注意：日期控制元件name與ID要保持一致，validateField應該取的是名字，日期控制元件用的是bootstrap-datepicker

如果是遠端校驗，則在表單屬性中增加屬性，data-bv-remote-url=”remote.php”　返回值為true或false即可

暫時就用到這些，官方的例子很全面，屬性裡面可以直接遠端校驗，校驗密碼是否一致等等，用起來很方便。