Обработка двух форм на одной веб-странице

Question

У меня есть веб-страница с областью div.В этой области могут быть две разные формы.Это выглядит так:

Форма 1:

<div id="data" ...>
    <form action="/action1" method="post">
        <label for="label1">ID</label>
        <input type="text" name="id" id="label1" value="" />
        <label for="label2">Name</label>
        <input type="text" name="name" id="label2" value="" />
        <label for="label3">Description</label>
        <input type="text" name="desc" id="label3" value="" />
        <label for="label4">Address</label>
        <input type="text" name="address" id="label4" value="" />
     </form>
</div>

Форма 2:

<div id="data" ...>
    <form action="/action2" method="post">
        <label for="label1">ID</label>
        <input type="text" name="id" id="label1" value="" />
        <label for="label2">Firstname</label>
        <input type="text" name="first" id="label2" value="" />
        <label for="label3">Lastname</label>
        <input type="text" name="last" id="label3" value="" />
        <label for="label4">Address</label>
        <input type="text" name="address" id="label4" value="" />
        <label for="label5">eMail</label>
        <input type="text" name="mail" id="label5" value="" />
     </form>
</div>

Таким образом, есть две разные формы.Значения будут установлены с помощью jQuery (Ajax-вызов к бэкэнду).

Каков наилучший способ обработки этих двух форм?Должен ли я создать два файла только с формой и загрузить форму, когда они необходимы?(Форма 1 необходима, если несколько нажатий на кнопку 1, форма 2 необходима, если кто-то нажимает кнопку 2 - события обрабатываются на стороне клиента).Или я должен поместить обе формы в один файл HTML и включить или отключить форму?

Answer 1

Я думаю, вы должны держать обе формы на одной странице.И показать / скрыть требуемую форму в соответствии с требованием.

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

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

См. Статью Минимизация HTTP-запросов от разработчиков Yahoo .Они явно предлагают минимизировать HTTP-запросы.

Answer 2

Ничто не мешает вам иметь обе формы в HTML и условно скрывать / показывать ту, которую вы хотите активную.Лучше всего дать каждой форме (или содержащей ее div) уникальный идентификатор и использовать его для отображения / скрытия с помощью jQuery.