使用tips的方式提示表单验证的提示信息

用于表单验证 安装 bower install check-form-tips angular.module('app', ['check-form-tips']) 校验配置使用angular原生的表单校验方式 如required,ng-pattern等 使用 msg-options 用于自定义提示消息 <input name='code'/> name属性是必须的,用于确定唯一的表单元素

<div> <form novalidate name="saveForm"> <table my-form="saveForm" check-tips-home check-form="checkForm" submited="saveFormSubmited"> <tr> <td><label>CODE:</label></td> <td> <input type="text" check-layer-tips ng-maxlength="20" ng-pattern="/^[A-Za-z\d-.]+$/" msg-options="{pattern:'不能输入中文和特殊符号',required:'自定义不能为空的提示'}" required name="code" ng-model="pageData.form.code"> </td> </tr> <tr> <td><label>名称:</label></td> <td><input type="text" check-layer-tips ng-maxlength="20" required name="name" ng-model="pageData.form.name"></td> </tr> </table> </form> <div> <button class="sure" ng-click="save()">提交</button> </div> </div>

$scope.save = function () { //表单校验 if (!$scope.saveForm.$valid) { //提示失败 //防止未修改值时表单校验失败 $scope.saveFormSubmited = true; //触发所有表单校验 $scope.checkForm = !$scope.checkForm; return; } //执行提交 //ajax... }; 效果

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。