多维数组jquery移动

时间:2013-06-07 15:50:38

标签: jquery jquery-mobile web

我有这样的表格:

        <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="contacto@correo.com" 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>

我的问题是,如何让我的表单实时创建字段? 因为我需要提供用户,能够发送与用户想要的一样多的信息

1 个答案:

答案 0 :(得分: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="contacto@correo.com" style="width: 10em;">

这样,无论存在多少这些输入,数据都会在提交表格时进入下一页。

解释此输入的服务器端代码应该尝试通过检测存在的数量来遍历所有值,因为POST变量将是数组,这应该不困难。