Зачем использовать тег формы, когда вы отправляете через ajax?

Философский вопрос:

Скажем, у меня есть веб-приложение, которое требует javascript и современный браузер, поэтому прогрессивное улучшение не является проблемой. Если моя форма строится через javascript, и мои обновления данных выполняются через ajax POST и PUT, действительно ли есть какая-то причина для переноса моих элементов управления в тег формы? Если я все еще собираюсь использовать тег, скажем, по смысловым или структурным причинам, есть ли какая-либо причина иметь параметры действия и метода, которые я буду игнорировать? Это похоже на удержание с более ранней эпохи.

Ответ 1

Существует по крайней мере одна важная функция пользовательского опыта, предоставляемая специально путем переноса входов внутри тега формы:

Ключ ввода отправит форму. На самом деле, в Mobile Safari, вы получаете кнопку "Перейти" появится на клавиатуре.

Без формы, обертывающей входные данные, нечего отправлять.

Конечно, вы можете вводить поведение ввода-ключа через событие нажатия клавиши, но я не знаю, работает ли это для мобильных устройств. Я не знаю о вас, но я предпочел бы работать с семантикой, предоставляемой браузером, чем с имитацией событий.

В вашем случае вы просто предоставите обработчик события onsubmit для формы, который сделает ваш AJAX submit, а затем return false, отменив фактический submit.

Вы можете просто предоставить action="" (что означает "self" ), а method не требуется — по умолчанию он равен GET.

Ответ 2

Если вам не требуется прогрессивное усовершенствование, вам теоретически они не нужны.

С другой стороны, form имеет несколько классных группирующих и семантических эффектов. Используя их, вы можете группировать свои элементы формы логически и упростить для ваших скриптов сбор значений определенных элементов.

Например, если вы хотите, чтобы ajax-отправить какой-то пользовательский ввод, всегда легче сказать: "пусть все элементы в этой форме и представляют их", чем говорят "давайте возьмем этот вход, эти два выбора и эти три текстовых поля и представить их". По моему опыту, это действительно помогает разработчику, если теги form присутствуют.

Ответ 3

AJAX замечательный, но, как сказал JamWaffles (+1 ему), использование тегов form обеспечивает резервный метод.

Лично я использую теги формы, даже для вещей, которые я отправляю с AJAX, потому что он синтаксически понятен и позволяет легко захватывать все входы в определенной форме. Да, вы могли бы сделать это с помощью div или что-то еще, но, как я сказал, использование формы синтаксически приятно.

Кстати, читатели экрана обрабатывают содержимое внутри form по-разному, поэтому есть вопросы доступности, которые следует учитывать в зависимости от того, как вы решите пойти. Обратите внимание, что анекдотические данные свидетельствуют о том, что Google рассматривает доступность в своих рейтингах, поэтому, если SEO вас беспокоит, используйте форму и делайте это правильно.

Ответ 4

Резюме: формы для MVC, простые веб-приложения, плохо для ориентированных на компоненты, богатых веб-приложений.

Причина: формы не могут вставлять другие формы: большое ограничение для компонентно-ориентированной архитектуры.

Подробнее: Для типичных приложений MVC формы отличные. В богатых, сложных веб-приложениях, использующих множество javascript и AJAX и с множеством компонентов здесь и там, мне не нравятся формы. Причина: формы не могут вложить другие формы. Тогда, если каждый компонент отображает форму, компоненты не могут вставлять друг друга. Очень жаль. Меняя все формы на divs, я могу их вложить, и всякий раз, когда я хочу захватить все параметры, чтобы передать их в ajax, я просто делаю (с jQuery):

$( "# id_of_my_div" ) найти ( "[имя]" ) сериализации();.

(или некоторая другая фильтрация)

вместо:

$( "# id_of_my_form" ) сериализации();.

Хотя, по сентиментальным и семантическим причинам, я продолжаю называть свои divs something_form, когда они действуют как формы.

Ответ 5

Не то, что я вижу. В настоящее время я создаю веб-приложение, которое использует <form> s, но я использую их, поэтому у меня есть метод возврата, если у пользователя отключен JavaScript (e.preventDefault обычно останавливает отправку формы). Для вашей ситуации, когда вы говорите, что пользователь ДОЛЖЕН иметь JavaScript, тег <form> не нужен, но может быть идея сохранить его в любом случае, если браузер должен что-либо с ним сделать или получить к нему доступ как своего рода класс.

Короче говоря, нет, вам не нужно использовать <form>, если вы делаете чистый AJAX, хотя и оставляете его в идее, если вдруг решите создать резервный код в будущем.

Ответ 6

По-моему: если вы используете его по семантическим соображениям, используйте его по назначению. Атрибут action необходим (также может быть оставлен пустым), чтобы быть хорошо сформированным, также вы можете отделить свои URI от вашей js-логики, установив атрибут действия и прочитав его перед вызовом ajax.

Ответ 7

Я не понимаю, зачем вам здесь использовать тег формы. Единственная причина использовать тег формы (кроме того, чтобы получить вашу разметку для проверки), - это если вы хотите, чтобы пользователь "отправлял" данные с помощью стробированного ввода или тега кнопки. Если вам это не нужно, тогда нет необходимости в форме. Однако, не уверен, что это будет считаться "действительной" разметкой. Если вы его используете, вы можете просто сделать <form action="">, поскольку действие является единственным обязательным атрибутом тега формы. Тем не менее, у вас есть хороший момент, будущее веб-приложений, вероятно, больше не будет нуждаться в форме и традиционной методологии подачи. Очень интересно и радует меня. хехе:)