0

私は次のコードを持っています...

<h3>Guests</h3>
<form class="form-inline">
    <fieldset>                                  
        <label class="control-label" for="input01">First Name:</label>
            <input type="text" class="input-small" id="input01">                            
        <label class="control-label" for="input01">&nbsp;&nbsp;Middle Name:</label>
            <input type="text" class="input-small" id="input01">
        <label class="control-label" for="input01">&nbsp;&nbsp;Last Name:</label>
            <input type="text" class="input-small" id="input01">
        <label class="control-label" for="input01">&nbsp;&nbsp;Birthday:</label>
            <input type="text" class="input-small" id="input01">>                   
    </fieldset>
</form>

「さらに追加」というボタンを追加して、要素の新しい行を追加し、最終的にフォームをデータベースに保存できるようにしたいと考えています。行を追加するボタンを追加すると (これには、データベースにレコードを追加する必要があります。変更されたレコードについては、データベース内のレコードを更新したい)。

したがって、マルチパートの質問は次のとおりです。

  1. 「さらに追加」ボタンをクリックすると、データベースにレコードを追加するのに最適なタイミングだと思います。次に、フォームを保存するときに、フォーム内のすべてのレコードをループして更新します。それとも他のアイデアはありますか?
  2. 要点:ループスルーして更新を実行する方法について誰かが提案できる例はどこかにありますか?
4

2 に答える 2

4

「さらに追加」ボタンをクリックするのは 、データベースにレコードを追加するのに最適なタイミングではないことをお勧めします。誰かがボタンをクリックして、実際には行に記入していないと想像してみてください。フォームを使いこなして、よりインタラクティブなユーザーエクスペリエンスを提供したいのはすばらしいことですが、「フォーム101」を損なうことはありません。「送信/保存」ボタンを用意してください。データベースに保存する前に検証してください。ロジックは非常に単純です。行のIDをどこかに非表示にする必要があります(おそらく非表示のテキストフィールド)。ロジックは、「$ _ POSTを受け取りました。必要なデータが存在し、OKであることを確認しました。IDはありますか?はい:更新します。いいえ:挿入します。」のようになります。

于 2012-06-02T09:03:17.953 に答える
2

同時にデータベースに値を保存することは良い考えではないことに同意し、ここで何をしようとしているのかもう一度考えてみてください。誰かが「追加」をクリックすると、新しい行が作成され、それらの行の値をデータベースに追加しますしかし、最初の行はどうなりますか...

これが役立つかもしれません

    <label class="control-label" for="input01">First Name:</label>
        <input type="text" class="input-small" id="input01" name="firstname[]">                            
    <label class="control-label" for="input01">&nbsp;&nbsp;Middle Name:</label>
        <input type="text" class="input-small" id="input01" name="middlename[]">
    <label class="control-label" for="input01">&nbsp;&nbsp;Last Name:</label>
        <input type="text" class="input-small" id="input01" name="lastname[]">
    <label class="control-label" for="input01">&nbsp;&nbsp;Birthday:</label>
        <input type="text" class="input-small" id="input01" name=birthday[]>                   

ボタンがクリックされたときに表示するフィールドをjs varに保存します

var extras = $('fieldset').clone();

それから

$(".yourAddButton").click(function(){ $("form").append(extras); });

最後に、フォームを送信するための送信ボタンがあることを忘れないでください。

于 2012-06-02T10:28:58.667 に答える