Въведение във валидирането на форми за зареждане
Валидирането се използва за формиране на Приемане с някои правила и разпоредби. Bootstrap има много класове за изграждане на форма. Но валидирането изисква контролни данни за формата. В тази тема ще научим за видовете валидиране на формуляра Bootstrap.
Например формулярът има парола. Паролата има много правила според изискванията. На някой му трябват букви, на мнозина им трябват цифри, в противен случай някой изисква някакви специални знаци. Потребителят знае изпълнението на изискването, валидирането е важно.
Понякога потребителят не получава точното изискване за формуляра или колко е необходимо за изпълнение, че валидирането на времето е полезно за правилното подаване на данни. Ако не отговаряте на спецификацията, тогава получавате отзивите във формата автоматично.
Как да валидирате формуляри с Bootstrap?
- Формата за първоначално зареждане прави валидирането преодоляване на всички усложнения на кодирането на JavaScript и лесно се работи с класове.
- Три валидиране на формата за зареждане идва с малко глификон, за да получите съобщението за грешка, предупреждение и успех. Класове за валидиране, винаги поставени в родителския клас.
- Наред с класовете за валидиране, той също изисква клас-обратна връзка, за да получи иконата на правилното място в полето за въвеждане на формуляр заедно с етикета. Този клас е поставен в родителския клас.
Пример:
Класът за форма-контрол-обратна връзка също беше необходим с иконата глификон, за да зададете иконата в полето на формата за въвеждане.
Пример:
Видове валидиране на форми за зареждане
Има 3 вида Bootstrap Форма, както е споменато по-долу:
1. има успех
Този клас използва за получаване на посланието за успех. С този клас на валидиране, потребителите също се нуждаят от икона „glyphicon glyphicon-ok“, за да покажат иконата на успеха. Ако потребителят въведе правилно входа във формата, тогава това валидиране работи.
Класът успех е създаден с родителски клас. За да получите съобщението за успех, използвайте това валидиране, използвано. Примерът по-долу дава формат на хоризонтална форма. Изходът идва със съобщението в зелен цвят.
Синтаксис:
.
Пример:
Paasword
изход:
2. има предупреждение
Този клас се използва за предупредителни съобщения за въвеждане на формуляри. С този клас на валидиране, потребителите също се нуждаят от икона „глификон глификон - предупредителен знак“, за да се покаже иконата на предупреждение. Ако въведем грешен вход във формуляра, имаме още един шанс да въведем вход, който задейства проверката на времето за проверка.
Клас за проверка на предупреждението, поставен в клас родител с клас за обратна връзка. Ако потребителят получи предупреждение за някаква грешка, този клас работи. Резултатът идва със съобщението в жълт цвят.
Синтаксис:
.
Пример:
Paasword
изход:
3. има грешка
Този клас се използва за съобщение за грешка при въвеждане на формуляр. С този клас на валидиране, потребителите също се нуждаят от иконата „glyphicon glyphicon-remove“, за да покажат иконата на грешка. Ако въведем грешен вход във формата, тази проверка заработи.
Клас за проверка на грешки, поставен в родителски клас с клас за обратна връзка. Ако потребителят получи съобщението за грешка за грешка, този клас работи.
Синтаксис:
Пример:
Paasword
изход:
Описание: Цялата форма е хоризонтално оформление. Етикетът има 2 колони, а входът има 10 колони. Зададен клас за валидиране с обратна връзка в родителския div. За да видите потребителя на иконата, използвайте икони глификон с обратна връзка-обратна връзка в
Потребителите работят върху паролата. или паролата е правилна, тогава работата за валидиране на успеха или паролата е грешна, тогава работата за проверка на грешката. Ако паролата има някаква грешка и можем да успеем да я пренасочим, тогава предупреждението за проверка работи.
Примери за валидиране на форми за зареждане
По-долу са дадени различните примери за валидиране на формите за зареждане:
Пример №1
Следващият пример е валидиране с хоризонталната форма. Знакът Glyphicon е работа върху вътрешната кутия за въвеждане във формата. Етикетът и въвеждането в една хоризонтална линия, но всички класове от формулярни групи са поставени вертикално.
Success
Warning
Error
изход:
Пример №2
Следващият пример е валидиране с вертикалната форма. Във вертикалната форма всички етикети и входове са разположени вертикално. Glyphicon може да бъде разположен в реда на етикета в края на полето за въвеждане.
Във формата няма клас. Той рядко се използва във валидиране на формата в bootstrap.
Success
Warning
Error
изход:
Пример №3
Следващият пример е валидиране с inline формата. Вградената форма има всички етикети и вход в един ред, включително всички групи форми. Това е сложна, но валидираща икона, поставена във полето за въвеждане на формата.
Ако потребителите се нуждаят само от малка форма и форма за вход, тогава с валидирания, тогава може да се приложи инлайн формулярът.
Success
Warning
Error
изход:
Преди всичко има всички видове валидиране с цялото оформление и как работи. Съгласно изискванията и лекотата на потребителя изберете формата на валидиране и оформление на формата.
заключение
Най-вече валидирането на формата се случва от страна на сървъра, за да се контролират данните на формата в база данни. За тези цели получаваме много сложно кодиране и използване на метода за валидиране с помощта на езика на JavaScript.
Bootstrap направи всичко в една страница на формата, като избягваше усложненията и продължителното кодиране и без усилие контролира данните на формуляра.
Препоръчителни статии
Това е ръководство за валидиране на формуляра за зареждане. Тук обсъждаме валидирането на 3 вида Bootstrap Forms заедно с подходящите примери. Можете също да разгледате следната статия.
- Оформление на обувката
- Компоненти за зареждане
- Какво е Bootstrap?
- Команди за зареждане
- Оформление на формуляра за зареждане с примери
- Форми в JavaScript | Програма за валидиране на формуляра