JavaScript Form Validation
форма проверки HTML может быть сделано с помощью JavaScript.
Если поле формы (Fname) пусто, то эта функция предупреждает сообщение, и возвращает ложь, чтобы предотвратить форму от их представления:
Пример JavaScript
function validateForm() {
var
x = document.forms["myForm"]["fname"].value;
if (x == null || x == "") {
alert("Name must be filled out");
return false;
}
}Эта функция может быть вызвана, когда форма была отправлена:
Пример HTML-форм
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()"
method="post">
Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form> Попробуй сам " HTML Form Validation
валидация HTML форма может быть выполнена автоматически с помощью браузера:
Если поле формы (fname) пусто, то required атрибут предотвращает эту форму от их представления:
Пример HTML-форм
<form action="demo_form.asp" method="post">
<input type="text" name="fname" required >
<input type="submit" value="Submit">
</form> Попробуй сам " Автоматическая проверка HTML форма не работает в Internet Explorer 9 или более ранних версий.
Валидация данных
Проверка достоверности данных является процесс обеспечения того, чтобы компьютер вход чистый, правильный, и полезно.
Типичные задачи проверки являются:
- имеет пользователь заполнил все необходимые поля?
- имеет пользователь ввел действительную дату?
- имеет пользователь ввел текст в числовом поле?
Чаще всего, целью проверки достоверности данных является обеспечение правильного ввода в компьютер приложения.
Проверка может быть определена многими различными способами, и развернуты по-разному.
Проверка на стороне сервера выполняется с помощью веб - сервера, после ввода был отправлен на сервер.
Проверка на стороне клиента выполняется с помощью веб - браузера, до ввода отправляется на веб - сервер.
HTML Ограничение проверки
HTML5 представила новую концепцию проверки HTML под названием ограничение проверки.
Ограничение проверки HTML основывается на:
- Ограничение проверки входных атрибутов HTML
- Ограничение проверки CSS Псевдо селекторы
- Ограничение проверки DOM Свойства и методы
Ограничение проверки входных атрибутов HTML
| Атрибут | Описание |
|---|---|
| disabled | Указывает, что входной элемент должен быть отключен |
| max | Задает максимальное значение входного элемента |
| min | Определяет минимальное значение входного элемента |
| pattern | Задает шаблон, значение входного элемента |
| required | Указывает, что поле ввода требует элемента |
| type | Определяет тип входного элемента |
Для получения полного списка, перейдите на HTML входных атрибутов .
Constraint Validation CSS Псевдо селекторы
| селектор | Описание |
|---|---|
| :disabled | Выбирает элементы ввода с "ОТКЛ" атрибута, указанного |
| :invalid | Выбирает входные элементы с недопустимыми значениями |
| :optional | Выбирает элементы ввода без "необходимого" атрибута, указанного |
| :required | Выбирает элементы ввода с "требуемого" атрибута, указанного |
| :valid | Выбирает элементы ввода с действительными значениями |
Для получения полного списка, надо CSS псевдо - классы .