1 加載jQuery和bootstrap.min.js 后引入bootstrapValidator.min.js

字段驗證之remote 遠程驗證(類似ajax驗證)，返回值必須是 {"valid":true}{"valid":false} true表示 驗證通過 false 表示驗證不通過。

當添加remote 驗證后，驗證通過表單不能提交 submit 按鈕里面多了一個 disabled="disabled" 按鈕被禁用了，無法提交表單，

這個是因為提交按鈕里面含有name或者其他元素如id, 導致表單增加驗證項，驗證不通過當然就不能提交了。所以果斷去掉。

如下：<button type="submit" class="btn btn-danger">提交</button> 里面的name id 都不能有。

貼源碼：

<form class="form-horizontal" role="form" method="post" action="/Admin/ProductCate/doAdd" id="addForm">

<div class="form-group">
<label for="cate_name" class="col-lg-2 col-sm-2 control-label text-center">分類名</label>
<div class="col-lg-6">
<input type="text" name="cate_name" class="form-control" id="cate_name" value="" placeholder="分類名">
</div>
</div>

<div class="form-group">
<div class="col-lg-offset-2 col-lg-6">
<button type="submit" class="btn btn-danger">提交</button>
</div>
</div>
</form>

<script src="/Admin/js/bootstrapValidator.min.js"></script>
<script type="text/javascript">
$(function(){
　　$('#addForm').bootstrapValidator({
　　　　message: 'This value is not valid',?
　　　　fields: {
　　　　cate_name: {
　　　　　　　validators: {
　　　　　　　　　　notEmpty: {message: '分類名不能為空'},
　　　　　　　　　　stringLength: {min: 2,max: 30,message: '分類名長度必須在2到30之間'},
　　　　　　　　　　remote: {//ajax驗證。
　　　　　　　　　　　　url: '/Admin/ProductCate/ajaxCheckCateName',
　　　　　　　　　　　　type: 'post',
　　　　　　　　　　　　data:{cate_name:function() {
　　　　　　　　　　　　　　return $('input[name="cate_name"]').val() }
　　　　　　　　　　　　},
　　　　　　　　　　　　delay : 2000,
　　　　　　　　　　　　dataFilter:function(data,type){
　　　　　　　　　　　　　　return data;
　　　　　　　　　　　　},
　　　　　　　　　　　　message: '分類名稱已存在',//提示消息
　　　　　　　　　　}
　　　　　　}
　　　　}
　　}
　　})
});

后端PHP驗證：

public function ajaxCheckCateName()
{
　　$data['cate_name'] = I('post.cate_name','','trim,strip_tags');
　　$hasName = $this->productcateService->findByName($data['cate_name']);
　　if($hasName){
　　　　exit('{"valid":false}');
　　}else{
　　　　exit('{"valid":true}');
　　}
}

以上就是我在開發中碰見的坑，希望對大家有點作用

?

轉載于:https://www.cnblogs.com/liuxuyang522/p/8941769.html

總結

以上是生活随笔為你收集整理的bootstrapValidator remote 验证问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。