Вложение HTML-форм в один элемент таблицы

Question

Я хочу вложить 2 отдельные формы в таблице. Я бы дал краткий обзор нынешнего сценария.

<form action="action1">
<table>
<tr>
<td>...</td>
<td><input type="checkbox" ....></td>
<td>Tag1</td>
</tr>
<tr>
<td>...</td>
<td><input type="checkbox" ....></td>
<td>Tag2</td>
</tr>
.
.
.
</table>
<input type="submit">
</form>

Теперь для каждой строки я хочу добавить кнопку, которая будет отображаться на другой странице под названием action2. Все, что требуется для action2, - это знать, какой тег (например, Tag1, Tag2, ....) был нажат. Я думал о добавлении следующего элемента в каждой строке.

<td><form action="action2"><input type="hidden" name="tag_" value="corresponding_tag_in_this_row" /><input type="submit"></form></td>

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

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

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

Answer 1

Основываясь на этом:

Для action1 требуются все данные из флажков, а для action2 просто необходимо знать соответствующий тег строки.

Вам не нужна форма для action2, Вместо этого используйте простой a связать и построить соответствующий URL программно.

Например:

<td><a href="action2?tag={corresponding_tag_in_this_row}">Do Action 2</a></td>

куда {corresponding_tag_in_this_row} заменяется используемым языком или языком шаблонов с соответствующим тегом для этой строки. Учитывая, что вам нужно это просто

[распечатать] тег, соответствующий нажатой кнопке

Это должно сделать это без каких-либо проблем, уменьшит объем необходимого HTML-кода и позволит пользователю добавить в закладки этот определенный тег.

Answer 2

Вы не можете сделать форму submit на разные действия. Вы должны либо использовать JavaScript и заставить каждую кнопку открывать разные страницы, либо создавать разные формы, которые отправляются на разные страницы. Например, если вы хотите сделать button1 представить page1 а также button2 представить page2 Вы должны поместить каждый в разные формы с разными action свойства.

Пример использования чистого JavaScript:

<script type="text/javascript">
    function sendForm(action) {
         MyForm.action = action;
         MyForm.submit();
    }
    ButtonOne.addEventListener(
        'click', 
        function() { sendForm('action_one.php') }, 
        false);
    ButtonTwo.addEventListener(
        'click', 
        function() { sendForm('action_two.php') }, 
        false);
    ButtonThree.addEventListener(
        'click', 
        function() { sendForm('action_three.php') }, 
        false);
</script>

И позже в вашем коде:

<form id="MyForm">
    <input …/>
    …
    <button id="ButtonOne" />
    <button id="ButtonTwo" />
    <button id="ButtonThree" />
</form>

Answer 3

HTML позволяет назначать различные действия в кнопках. formactionАтрибут может быть установлен на действие, отличное от родительского элемента. Я связался с MDN для атрибутов на input type="submit"элемент, но его можно использовать для button type="submit"также элементы. Таким образом, ваш HTML должен быть примерно таким:

      <td><input formaction="action2" type="submit"></td>

Однако при этом вся форма будет отправлена ​​на этот URL-адрес действия, поэтому вам решать, как использовать информацию по-другому на стороне сервера.

HTML не позволяет вкладывать formэлементы однако.

Answer 4

Выполните следующие действия: 1. отправьте результаты на страницу действия с помощью метода (например, post) 2. затем укажите местоположение заголовка и перенаправьте на указанную страницу, используя предложение if.... else... следующим образом:

if($_POST['ACTION1'])
{
header('Location: http://www.example.com/');
}
elseif($_POST['ACTION2'])
{
header('Location: http://www.example2.com/');
}

Answer 5

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

Например, в php вы можете сделать что-то вроде:

<form action="processing.php" method="post">
    ...
    <input type="submit" name="action1" value="Do Action 1" id="action1Button">
    <input type="submit" name="action2" value="Do Action 2" id="action2Button">
</form>

Затем в processing.php:

    if (!empty($_POST['action1'])) {
    // DO ACTION 1 STUFF
    // Only look for the inputs etc that relate to action 1

    }
    // could be an if/else if there are only 2
    if (!empty($_POST['action2'])) {
    // DO ACTION 2 STUFF
    // Only look for the inputs etc that relate to action 2
    }