Основы Форм jQuery Mobile
jQuery Mobile автоматически стилизует HTML-формы, чтобы заставить их выглядеть привлекательными и благоприятными для касания.
Строение Формы jQuery Mobile
jQuery Mobile использует CSS для придания стиля элементам HTML-формы, делая их привлекательными и легкими в использовании.
В jQuery Mobile можно использовать следующие средства управления формой:
- Поля Ввода ТекстаText Inputs
- Поисковые Поля Ввода
- Кнопки
- Флажки
- Меню Выбора
- Ползунки
- Переключатели
Работая с формами jQuery Mobile необходимо знать:
- Каждый элемент <form> должен иметь атрибут метода и действия
- Каждый элемент формы должен иметь уникальный атрибут "id". id должен быть уникальным для всех страниц сайта. Это связано с тем, что одностраничная модель навигации jQuery Mobile позволяет представлять несколько различных страниц в одно и то же время
- Каждый элемент формы должен иметь метку. Установите атрибут for метки, чтобы он соответствовал id элемента
Чтобы скрыть метку, используйте класс ui-hidden-accessible. Это часто используется, когда Вы хотите, чтобы атрибут заполнителя элемента служил меткой:
Контейнеры Полей
Чтобы метки и элементы формы смотрелись должным образом на более широких экранах, поместите их в элемент <div> или <fieldset> с атрибутом data-role="fieldcontain":
Атрибут fieldcontain стилизует метки и средства управления формой на основе ширины страницы. Когда ширина страницы больше чем 480px, это автоматически располагает метку на той же самой строке, что и элемент управления формой. Когда ширина меньше чем 480px, метка будет помещена выше элемента формы.
Подсказка: Чтобы запретить jQuery Mobile автоматически стилизовать касаемые элементы, используйте атрибут data-role="none":
Отправка формы в jQuery Mobile
jQuery Mobile автоматически обработает отправку формы через AJAX и попытается интегрировать ответ сервера в DOM приложения.
