Bootstrap验证|复选框数据切换="切换"

时间:2016-05-31 06:13:56

标签: angularjs twitter-bootstrap bootstrapvalidator

我想在带有切换效果的复选框上应用验证

 <div class="togglebutton form-group has-feedback paddingTopBtn8">
    Yes<label> <input type="checkbox" ng-model="checkfield" required data-error="This is an mandatory field">
   <div class="help-block with-errors"></div>
   <span class="toggle"></span></label>No
</div>

任何人都可以帮助我。它不起作用。我也应用了必需和数据错误,但在提交时,表单显示ng-valid我是否选中了复选框

提前致谢

2 个答案:

答案 0 :(得分:1)

我不清楚你用复选框切换效果是什么意思。

但是我使用了https://scotch.io/tutorials/angularjs-form-validation的表单验证示例,并为复选框验证创建了一个小POC。

请看这里。

 <div class="togglebutton form-group has-feedback paddingTopBtn8">
    Yes<label> <input type="checkbox" ng-model="user.checkfield" required    
    name="checkfield">
    <p ng-show="userForm.checkfield.$invalid && !userForm.checkfield.$pristine"   
    class="help-block">Please toggle.</p>
    <span class="toggle"></span></label>No
</div>

CodePen Example

答案 1 :(得分:0)

我认为你只需要:

 <input type="checkbox" ng-model="checkfield" required data-error="This is an mandatory field" checked data-toggle="toggle" data-on="Yes" data-off="No" data-onstyle="success" data-offstyle="danger">