0

私はこのフォームを持っています：

        <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>

私の質問は、フォームがリアルタイムでフィールドを作成する方法を教えてください。ユーザーが望むだけ多くの情報を送信する機能をユーザーに提供する必要があるため

4

1 に答える 1

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 変数は配列になるため、これは難しくありません。

于 2013-06-07T15:56:48.197 に答える