1 В избранное 0 Ответвления 0

OSCHINA-MIRROR/Longbow-longbow-validate

Присоединиться к Gitlife
Откройте для себя и примите участие в публичных проектах с открытым исходным кодом с участием более 10 миллионов разработчиков. Приватные репозитории также полностью бесплатны :)
Присоединиться бесплатно
Клонировать/Скачать
Внести вклад в разработку кода
Синхронизировать код
Отмена
Подсказка: Поскольку Git не поддерживает пустые директории, создание директории приведёт к созданию пустого файла .keep.
Loading...
README.md

Клиентская система валидации данных

При работе с веб-приложениями часто требуется проверка данных перед их обновлением или сохранением. Такую проверку мы называем клиентской системой валидации данных, и предлагаемый здесь фреймворк предоставляет простой способ её реализации.

Связь между простыми HTML стилями или атрибутами и методами валидации осуществляется через специальные названия классов или атрибутов. Валидация происходит при потере фокуса контролем или при нажатии кнопки валидации.

Онлайн демонстрация

Одностраничный пример: http://longbowenterprise.gitee.io/slidercaptcha/

Быстрое начало

Компоненты зависят от jQuery и Bootstrap Validate

CSS

<link href="./lib/twitter-bootstrap/css/bootstrap.min.css">

Копируйте и вставьте тег <link> для импорта стилей в секцию <head>, расположив его перед всеми другими стилями.

JS

<script src="./lib/jquery/jquery.min.js"></script>
<script src="./lib/twitter-bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="./lib/validate/jquery.validate.js"></script>
<script src="./lib/validate/localization/messages_zh.min.js"></script>
<script src="./dist/longbow.validate.js"></script>

Копируйте и вставьте теги <script> для импорта скриптов в конец секции <body>.

Пример использования

Пример кода страницы для валидации:```html

Настройка названия сайта
Сохранить
```1. Установите область действия валидации `data-toggle="LgbValidate"` 2. Установите кнопку валидации `data-valid-button="[data-method='title']"` 3. Укажите контролы для валидации `data-valid="true"` 4. Установите правила валидации `maxlength="50"`

Поддерживает CSS стили и HTML атрибуты.

Эффекты

Левая часть — стиль при некорректных данных, правая часть — стиль при корректных данных.

Встроенные правила валидации

  • required: "Это обязательное поле"
  • remote: "Исправьте это поле"
  • email: "Введите действительный адрес электронной почты"
  • url: "Введите действительный URL"
  • date: "Введите действительную дату"
  • dateISO: "Введите действительную дату (YYYY-MM-DD)"
  • number: "Введите действительное число"
  • digits: "Допускаются только цифры"
  • creditcard: "Введите действительный номер кредитной карты"
  • equalTo: "Ваш ввод не совпадает"
  • extension: "Введите допустимое расширение"
  • maxlength: "Максимальное количество символов — {0}"
  • minlength: "Минимальное количество символов — {0}"
  • rangelength: "Введите строку длиной от {0} до {1} символов"
  • range: "Введите значение от {0} до {1}"
  • step: "Введите целое число, кратное {0}"
  • max: "Введите значение, меньшее или равное {0}"
  • min: "Введите значение, большее или равное {0}"
  • ip: "Введите корректный IP-адрес"
  • radioGroup: "Выберите один вариант"
  • checkGroup: "Выберите один вариант"
  • userName: "Логин не может содержать недопустимые символы"
  • greaterThan: "Значение должно быть больше {0}"
  • lessThan: "Значение должно быть меньше {0}"## Расширенные правила валидации
$.validator.addMethod("userName", function (value, element) {
    return this.optional(element) || /^[a-zA-Z0-9_@.]*$/.test(value);
}, "Логин не может содержать недопустимые символы");

Добавление своих правил валидации с помощью статического метода $.validator.addMethod

API

Получение экземпляра компонента валидации для определённого контрола $('#Id').lgbValidator()

Проверка всех компонентов внутри области валидации $('#Id').lgbValid() Возвращает true, если все значения корректны, и false, если есть ошибки

Участие в проекте

  1. Fork этого проекта
  2. Создайте новую ветку Feat_xxx
  3. Подтвердите изменения
  4. Создайте новый Pull Request

Комментарии ( 0 )

Вы можете оставить комментарий после Вход в систему

Введение

Простая и полезная клиентская структура проверки, все правила проверки реализуются с помощью таблиц стилей или атрибутов, гибкая для расширения. Развернуть Свернуть
Apache-2.0
Отмена

Обновления

Пока нет обновлений

Участники

все

Недавние действия

Загрузить больше
Больше нет результатов для загрузки
1
https://api.gitlife.ru/oschina-mirror/Longbow-longbow-validate.git
git@api.gitlife.ru:oschina-mirror/Longbow-longbow-validate.git
oschina-mirror
Longbow-longbow-validate
Longbow-longbow-validate
master