Угловое всплывающее окно проверки HTML5 не отображается для двух или более полей

Question

Угловое всплывающее окно проверки HTML5 не отображается для двух или более полей

0

По какой-то причине Угловая проверка не отображает Html5/popups, если мы добавим два или более полей.

Проверьте эти два примера:

Пример с одним полем. Нажмите клавишу ввода, чтобы подтвердить поле, и Html5 baloon/popup покажет:

https://plnkr.co/edit/oKePef7p4O4AD59eWXe8?p=preview

Пример с двумя полями. Он не отображает Html5 baloon/popup при проверке поля.

https://plnkr.co/edit/ZkDwB40Zhas3yjkT6AdM?p=preview

Что здесь происходит!?

Заранее спасибо.

NavCore 20 июль 2016, в 22:14

Источник

0

Ни один из твоих plunkr не работает так, как ты упомянул.
Shashank Agrawal 21 июль 2016, в 08:32
0

Оформить заказ этой библиотеки github.com/sagrawal14/bootstrap-angular-validation
Shashank Agrawal 21 июль 2016, в 08:36
0

Я использую ng-сообщения, и теперь он работает! Спасибо
NavCore 21 июль 2016, в 09:46

Показать ещё 1 комментарий

Теги:

angularjs

html5

validation

popup

1 ответ

Ещё вопросы

Ни один из твоих plunkr не работает так, как ты упомянул.
Оформить заказ этой библиотеки github.com/sagrawal14/bootstrap-angular-validation
Я использую ng-сообщения, и теперь он работает! Спасибо

developer033 · Accepted Answer · 2016-07-20T18-34-00.000Z

На самом деле, ни один из ваших plnkrs ничего не делает, вы пытаетесь использовать модуль ngMessages но вы не ставили какую-либо ошибку сообщения или что-то еще.

Взгляните на эту простую демонстрацию:

(function(angular) {
  'use strict';
  angular.module('ngMessagesExample', ['ngMessages']);
})(window.angular);

<!DOCTYPE html>
<html ng-app="ngMessagesExample">

<head>
  <script src="/angular.min.js"></script>
  <link rel="stylesheet" href="/bootstrap.min.css" />
  <script src="/jquery.min.js"></script>
  <script src="/bootstrap.min.js"></script>
  <script src="/angular-messages.min.js"></script>
</head>

<body>
  <form name="form">
    <div class="col-md-12">
      <div class="form-group" ng-class="{ 'has-error' : form.myName.$touched && form.myName.$invalid }">
        <label for="name">Enter your name:</label>
        <input type="text" class="form-control" name="myName" id="name" ng-model="name" ng-minlength="5" ng-maxlength="20" required />
        <div class="help-block" ng-messages="form.myName.$error" ng-if="form.myName.$touched">
          <p ng-message="required">This field is required</p>
          <p ng-message="minlength">This field is too short</p>
          <p ng-message="maxlength">This field is too long</p>
          <p ng-message="required">This field is required</p>
          <p ng-message="email">This needs to be a valid email</p>
        </div>
      </div>
      <div class="form-group" ng-class="{ 'has-error' : form.myEmail.$touched && form.myEmail.$invalid }">
        <label for="email">Enter your email:</label>
        <input type="email" class="form-control" id="email" name="myEmail" ng-model="email" required />
        <div class="help-block" ng-messages="form.myEmail.$error" ng-if="form.myEmail.$touched">
          <p ng-message="required">This field is required</p>
          <p ng-message="minlength">This field is too short</p>
          <p ng-message="maxlength">This field is too long</p>
          <p ng-message="required">This field is required</p>
          <p ng-message="email">This needs to be a valid email</p>
        </div>
      </div>
    </div>
  </form>
</body>

</html>

Я бы рекомендовал вам изучить этот учебник, чтобы узнать больше о ngMessages.

Я надеюсь, что это помогает!

Великий человек, я не пробовал с нг-сообщениями. Сейчас работает! Хотя я подумал, что вместо ng-сообщений можно использовать всплывающее окно html5 / baloon, но это не имеет значения .. Спасибо