香菜验证不工作角的js [英] Parsley validation not working Angular js

问题描述

我使用欧芹验证具有角JS，但它不工作我做错了任何一个可以正确或检测我的code中的错误。
如果我submiting所以它不工作没有显示我的任何误差欧芹显示，根据thier属性。
我还要补充欧芹库和没有得到有关它，因此什么错任何错误。

LoginView.html

 ＆LT;窗​​体类=形横NG提交='登录（）的数据验证=香菜＆GT;
                ＆LT; D​​IV CLASS =模头＆GT;
                    ＆LT; H3＆GT;登录和LT; / H3 GT＆;
                ＆LT; / DIV＆GT;                ＆LT; D​​IV CLASS =模体＆GT;
                    ＆LT; D​​IV CLASS =表单组＆GT;
                        ＆LT;标签=登录名级=COL-LG-3格式标记＆gt;用户名：​​LT; /标签＆gt;
                        ＆LT; D​​IV CLASS =COL-LG-8＆GT;
                            ＆LT;输入类型=文本级=表格控ID =登录名NG模型=LoginName将NAME =登录名占位=用户名数据类型=字母数字数据-required =真/＆GT;
                        ＆LT; / DIV＆GT;
                    ＆LT; / DIV＆GT;                    ＆LT; D​​IV CLASS =表单组＆GT;
                        ＆LT;标签=登录，密码级=COL-LG-3格式标记＆GT;密码：LT; /标签＆gt;
                        ＆LT; D​​IV CLASS =COL-LG-8＆GT;
                            ＆LT;输入类型=密码级=表格控ID =登录，密码NG-模式=LoginPassNAME =登录，密码占位=密码数据类型=字母数字数据 - 所需=真数据= MINLENGTH6数据= MINLENGTH6数据MAXLENGTH =20/＆GT;
                        ＆LT; / DIV＆GT;
                    ＆LT; / DIV＆GT;
                ＆LT; / DIV＆GT;
                ＆LT; D​​IV CLASS =模式躯＆GT;
                    ＆LT;按钮式=提交级=BTN BTN-小学＆GT;
                        ＆LT; I类=图标的用户图标白＆GT;＆LT; / I＆GT;登录
                    ＆LT; /按钮＆GT;
                ＆LT; / DIV＆GT;            ＆LT; /表及GT;
 

loginController.js

  $ scope.login =功能（）{          VAR用户= {
              用户名：$ scope.LoginName，
              密码：$ scope.LoginPass
          }
      };
 

解决方案

我花了一点工作和玩的东西左右，但我结束了创建一个名为指令 parsleyValidateInput 。把那要与香菜验证每个输入。

CoffeeScript的：

  angular.module（应用）指令'parsleyValidateInput'，（$超时） -  GT;
  链接：（范围，元素，ATTRS） -  GT;
    element.on删除， - ＆GT;
      element.closest（形）。香菜（'的removeItem，{##} attrs.id）    $超时 - ＆GT;
      element.attr（ID，输入_＃{_。UNIQUEID（）}），除非element.attr（ID）
      element.closest（形）。香菜（'的addItem，{##} attrs.id）
 

JavaScript的：

  angular.module（应用）。指令（parsleyValidateInput'，函数（$超时）{
  返回{
    链接：功能（范围，元素，ATTRS）{
      element.on（删除，函数（）{
        返回element.closest（形式），香菜（'的removeItem，＃+ attrs.id）。
      }）;
      返回$超时（函数（）{
        如果（！attrs.id）{
          attrs.id =输入_+（_.uniqueId（））;
          element.attr（'身份证'，attrs.id）;
        }
        返回element.closest（形式），香菜（'的addItem，＃+ attrs.id）。
      }）;
    }
  };
}）;
 

使用：

 ＆LT;形式香菜，验证＆GT;
   ＆LT; D​​IV CLASS ='行'NG重复='书书'＆GT;
   ＆LT;输入香菜，验证输入型=文本NG-模式='书'要求＆GT;
＆LT; /表及GT;
 

i am using parsely validation with angular js but its not working what i am doing wrong can any one correct or detect the mistake in my code. if i am submiting so its not working not showing me any error as parsely show , according to thier attributes. I also add parsely libraries and not getting any error related to it so what's going wrong.

LoginView.html

<form class="form-horizontal" ng-submit='login()' data-validate="parsley">
                <div class="modal-header">
                    <h3>Login</h3>
                </div>

                <div class="modal-body">
                    <div class="form-group">
                        <label for="login-Name" class="col-lg-3 form-label">User Name:</label>
                        <div class="col-lg-8">
                            <input type="text" class="form-control" id="login-Name" ng-model="LoginName" name="login-Name" placeholder="User Name" data-type="alphanum" data-required="true" />
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="login-Password" class="col-lg-3 form-label">Password:</label>
                        <div class="col-lg-8">
                            <input type="password" class="form-control" id="login-Password" ng-model="LoginPass" name="login-Password" placeholder="Password" data-type="alphanum" data-required="true" data-minlength="6" data-minlength="6" data-maxlength="20"/>
                        </div>
                    </div>
                </div>


                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">
                        <i class="icon-user icon-white"></i> Login
                    </button>
                </div>

            </form>

loginController.js

$scope.login = function() {

          var user = {
              "username" : $scope.LoginName,
              "password" : $scope.LoginPass
          }
      };

解决方案

Took me a little work and playing around with things, but I ended up creating a directive called parsleyValidateInput. Put that on every input you want to be validated with parsley.

coffeescript:

angular.module('app').directive 'parsleyValidateInput', ($timeout) ->
  link: (scope, element, attrs) ->
    element.on 'remove', ->
      element.closest('form').parsley('removeItem', "##{attrs.id}")

    $timeout ->
      element.attr('id', "input_#{_.uniqueId()}") unless element.attr('id')
      element.closest('form').parsley('addItem', "##{attrs.id}")

javascript:

angular.module('app').directive('parsleyValidateInput', function($timeout) {
  return {
    link: function(scope, element, attrs) {
      element.on('remove', function() {
        return element.closest('form').parsley('removeItem', "#" + attrs.id);
      });
      return $timeout(function() {
        if (!attrs.id) {
          attrs.id = "input_" + (_.uniqueId());
          element.attr('id', attrs.id);
        }
        return element.closest('form').parsley('addItem', "#" + attrs.id);
      });
    }
  };
});

use:

<form parsley-validate>
   <div class='row' ng-repeat='book in books'>
   <input parsley-validate-input type='text' ng-model='books' required>
</form>

这篇关于香菜验证不工作角的js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！