BootStrap Validator

表單驗證，必須有Form表單，需要用到form-group 

如果使用了 input-group 無法顯示出 校驗提示

<div class="input-group">
  <span class="input-group-addon">姓名</span>
  <input type="text" id="username" class="form-control" value="${username}" placeholder="姓名">
</div>

 

 

引入:

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Content/bootstrap/js/bootstrap.min.js"></script>
<link href="~/Content/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<script src="~/Content/bootstrapValidator/js/bootstrapValidator.min.js"></script>
<link href="~/Content/bootstrapValidator/css/bootstrapValidator.min.css" rel="stylesheet" />

<form>
<div class="form-group">
<label>Username</label>
<input type="text" class="form-control" name="username" />
</div>
<div class="form-group">
<label>Email address</label>
<input type="text" class="form-control" name="email" />
</div>
<div class="form-group">
<button type="submit" name="submit" class="btn btn-primary">Submit</button>
</div>
</form>

 

$(function () {
$('form').bootstrapValidator({

　　　　　　　　message: 'This value is not valid',
　feedbackIcons: {
　　　　　　　　valid: 'glyphicon glyphicon-ok',
　　　　　　　　invalid: 'glyphicon glyphicon-remove',
　　　　　　　　validating: 'glyphicon glyphicon-refresh'
　　　　　　　　 },
fields: {
username: {
message: '用戶名驗證失敗',
validators: {
notEmpty: {
message: '用戶名不能為空'
}
}
},
email: {
validators: {
notEmpty: {
message: '郵箱地址不能為空'
}
}
}
}
});
});