0

こんにちは開発者私はJavaスクリプト関数を使用して2つのテキストボックスと1つの選択ボックスを動的に作成しています...今、私はcodeigniterを使用しているので、作成された(n)フィールドの値をデータベース(関連テーブル)に投稿したいので、スクリプトを投稿してmコード

これは私が使用している単純なJavaスクリプトです

<script>
  var counter=1;
  function generateRow() {
    var count="<font color='red'>"+counter+"</font>";
    var temp ="<p>&nbsp;&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox' name='stop"+counter+"' placeholder='Stop Name'></input></div>&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox' name='timing"+counter+"' placeholder='Timing'></input></div>&nbsp;<div class='_25'><select id='ampm"+counter+"' name='ampm"+counter+"'><option>a.m</option><option>p.m</option></select>  </div>";

    var newdiv = document.createElement('div');
    newdiv.innerHTML = temp + count;

    var yourDiv = document.getElementById('div');
    yourDiv.appendChild(newdiv);
    counter++;
  }
</script>

これはphpファイルの私の部門です

 <div id="div">
 </div>

 <p>&nbsp;</p>
 <div class="_25">
    <p>
      <input type="button" name="button" class="button red" id="button" value="Add"  onclick="generateRow() "/></a>
    </p>
 </div>
 <input type='button' value='Remove Button' id='removeButton'>

これは私の関連するテーブルフィールドです

route_number    stop_name   am_pm   timing
4

3 に答える 3

4

これを行うための私のお気に入りの方法は、可能な限り DOM を使用することです。絶対に必要な場合を除き、カウンターは使用しないでください (カウンターは単なるバグの原因です)。簡単な例を次に示します。

Html/JS/jQuery (変化する可能性があります。簡単に理解できるように作成しました):

<form method="POST" id="theForm">
    <div id="fields">
        <input type="text" name="fields[]"/>
    </div>
    <input type="button" id="addField" value="Add Field"/>
</form>
<script type="text/javascript">
    $(document).ready(function() {
        $('#addField').click(function() {
            $('#fields').append(
                $('<input type="text" name="fields[]"/>')
            );
        })
    });
</script>

どのような種類のカウント変数も使用する必要がないことに注意してください。PHP と同じように、 を使用してインデックスを指定せずに POST 変数の配列を作成する[]と、サーバー (またはブラウザー？よくわかりません) が配列を作成します。フィールドがページにレンダリングされる順序<input />は、 を介して PHP に提供される順序になります$_POST。このコード...

foreach ($_POST['fields'] as $fieldIndex => $fieldValue) {
    doStuff($fieldValue);
}

... は、追加された順序で各フィールドを処理します。JavaScript を使用して入力を並べ替えたり削除したりすることもでき、それは に反映され$_POSTます。この方法を JSON エンコーディングと組み合わせると、複数入力の自由形式フィールドをすばやく簡単に処理できます。

アップデート：

上記のコードをユースケースに適用するには、明らかではない小さな追加が必要です。次のように、3 つの入力 (stop、timing、ampm) ごとに配列を作成する必要があります。

<form method="POST" id="theForm">
    <div id="fields">
        <input type="text" name="fields[stop][]"/>
        <input type="text" name="fields[timing][]"/>
        <select name="fields[ampm][]">
            <option value="am">AM</option>
            <option value="pm">PM</option>
        </select>
        <br/>
    </div>
    <input type="button" id="addField" value="Add Field"/>
</form>
<script type="text/javascript">
    $(document).ready(function() {
        $('#addField').click(function() {
            $('#fields').append(
                $('<input type="text" name="fields[stop][]"/>'),
                $('<input type="text" name="fields[timing][]"/>'),
                $('<select name="fields[ampm][]"><option value="am">AM</option><option value="pm">PM</option></select>'),
                $('<br/>')
            );
        })
    });
</script>

このフォームにいくつかのテスト データを入力すると、次の配列が生成されます。

[fields] => Array
(
    [stop] => Array
        (
            [0] => aaa
            [1] => bbb
        )

    [timing] => Array
        (
            [0] => 1111
            [1] => 2222
        )

    [ampm] => Array
        (
            [0] => am
            [1] => pm
        )

)

PHP でそれを処理するには、単純な昔ながらのループが必要です。

$numFields = count($_POST['fields']['stop']);

for ($i = 0; $i < $numFields; $i++) {

    // Pack the field up in an array for ease-of-use.
    $field = array(
        'stop' => $_POST['fields']['stop'][$i],
        'timing' => $_POST['fields']['timing'][$i],
        'ampm' => $_POST['fields']['ampm'][$i]
    );

    saveToDatabase($field);
}

残念ながら、今はすべてが正しいことを確認する時間がありません。そうあるべきであり、そうでない場合でも役立つかもしれません:)。数時間後にもう一度確認します。

于 2013-04-08T19:17:13.380 に答える
0

次の HTMLinputフィールドを作成できます。

<input type="text" name="data[]" />
<input type="text" name="data[]" />
<input type="text" name="data[]" />
// ...

dataこれは、 $_REQUEST スーパーグローバル内でキー化された配列につながりますvar_dump($_REQUEST['data']). やってみて。data[]PHP がインデックスを作成するので、配列のインデックスを作成する必要さえありません。

$_REQUEST['data']or$_POST['data']配列をforeachループ構造で処理したい場合があります。

foreach($_REQUEST['data'] as $data){
  // $data is the corresponding input field's value
}
于 2013-04-08T19:10:42.890 に答える