Динамическое построение формы из выпадающего меню

Question

Я хотел бы иметь возможность динамически добавлять строки в форму (теперь я включил форму ниже), используя раскрывающееся меню.Я предполагаю, что это была бы функция javascript, но я не уверен.

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

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

Буду признателен за любую помощь в освоении этого.

Спасибо,

Ник

Форма:

<form id="myForm" method="POST">
<label>Please select the number of people you are booking for:</label>
<select id="myDropDown">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select><br/><br />
<label>name:</label> <input type="text" name="name" id="name">
<label>email:</label> <input type="text" name="email" id="email">
</form>

Answer 1

Я бы хотел иметь возможность динамически добавить строки в форму, используя раскрывающийся список меню. Я предполагаю, что это будет Функция JavaScript, но я не уверен.

Да, было бы проще всего сделать это в JavaScript. Выберите хороший инструментарий, как jQuery, для помощи в навигации и изменении DOM. Вот простой скелет:

$(function() {
    var myForm = $("#myForm");
    $("#myDropDown").select(function() {
        var selected = $("option:selected", this).val();
        $("<input/>")
            .attr("type", "text")
            .attr("name", selected)
            .attr("id", selected)
            .appendTo( myForm );
    });
});

Answer 2

Я думаю, что формы нуждаются в уникальных именах для записи, а не идентификатора.

Зацикливание на выбранном номере, каждый делает это.

var newInput = document.createElement("input");
newInput.Name = "Unique name to form"
newInput.Type = "text" // or whatever

document.getElementById("formId").appendChild(newInput);

обратите внимание, что это можно сделать проще с jQuery, возможноно это будет работать со встроенной функцией js.