Многомерный Массив jquery mobile

Question

У меня есть эта форма:

        <div data-role="content"> 
    <form action="#" method="post" id="cen">
        <table>
            <thead>
                <tr>
                    <th>Contacto</th>
                    <th>Fecha</th>
                    <th>Hora</th>
                    <th >Mensaje</th>
                </tr>
            </thead>
            <tbody>
                <tr>                        
                    <td><input name="user" id="correo" type="email" placeholder="[e-mail]" style="width: 10em;"></td>
                    <td><input name="date" id="fecha" type="date" data-role="datebox" data-options='{"mode": "calbox"}'></td>
                    <td><input id="hora" name="hour" type="text" data-role="datebox" data-options='{"mode": "timebox", "overrideTimeFormat": 12}'></td>
                    <td><textarea id="mensaje" name="mensaje" placeholder="Su mensaje Aqui" style="width: 15em; max-width: 15em;"></textarea></td>
                </tr>
            </tbody>
        </table>
        <center><input type="submit" value="Enviar" data-inline="true"></center>
    </form>
    </div>

Мой вопрос, как я могу сделать так, чтобы моя форма создавала поле в режиме реального времени? Поскольку мне нужно предоставить пользователям возможность посылать столько информации, сколько пользователь хочет

Answer 1

Вы можете клонировать существующие элементы формы следующим образом:

var $clone = $("#cen").find("tbody").children().eq(0).clone(true);

$("#cen").find("tbody").append($clone);

Это можно легко положить в click обработчик события:

$("#some-button").on("click", function () {

    var $clone = $("#cen").find("tbody").children().eq(0).clone(true);

    $("#cen").find("tbody").append($clone);

    return false;
});

Я думаю, что единственное другое изменение, которое вам нужно сделать, это изменить name атрибуты ваших элементов ввода, добавив скобки, чтобы сделать их массивами [], Например:

<input name="user[]" id="correo" type="email" placeholder="[e-mail]" style="width: 10em;">

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

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