0

以下のフォームを作成しました。ユーザーがフィールドの数、たとえば6を入力すると、下のテーブルに6行あるようにすることは可能ですか? 送信ボタンなしで（このアクションのトリガーがテキスト入力ボックスから出るように）作成できれば素晴らしいと思います。

ここに画像の説明を入力

このフォームの html コードは次のとおりです。

<fieldset>
  <legend>Student Information</legend>
  Number of fields: <input type="text"><br />
  Total number of characters: <input type="text">
  <br>
  <br>
  <table border="1">
    <th></th>
    <th>field</th>
    <th>number of characters</th>
    <tr>
        <td>1</td>
        <td><input type="text"></td>
        <td><input type="text"></td>
    </tr>
    <tr>
        <td>2</td>
        <td><input type="text"></td>
        <td><input type="text"></td>
    </tr>
  </table>

  </fieldset>

これが不可能な場合 (送信ボタンなし)、どの方法で同じ結果を達成しますか? 助けや提案をありがとう。

4

3 に答える 3

3

PHP はサーバー側で、ページの読み込み時に一度だけ実行されます。HTML はプログラミング言語ではありません。PHP を使用してテーブルを生成できますが、ページをリロードする送信ボタンがある場合に限ります。ユーザーイベントが原因で発生する必要がある場合は、常に Javascript で実行する必要があります。

つまり、ページをリロードせずにこれを機能させるには Javascriptが必要です。理想的には、Jquery (Javascript の最も人気のあるプラグイン) を使用して DOM を操作します。

この入力があった場合：

<input id="field" type="text">

次のように休暇中イベントを呼び出すことができます。

$("p").focusout(function() 
{
    // Delete the previous table, and create a new one, here
});

実際のテーブルの作成に関しては、複雑ではありませんが、少し手間がかかります。起動するには、次のリファレンスを読む必要があります。

http://www.tutorialspoint.com/jquery/jquery-dom.htm

事前に JQuery を「インストール」する必要があります。これをコードの先頭に簡単に挿入できます。

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
于 2013-07-11T15:35:27.923 に答える
1

さて、ここに必要な投稿専用スクリプトがあります

<?php
  $rows=2;
  if(isset($_POST['submit']))
  {
    if($_POST['submit']=='Update')
    {
        if(isset($_POST['rows'])) $rows=max($rows, intval($_POST['rows'])); // minimum 2 rows
    }
    else
    {
        // process posted data here

        // reset post or jump to another page
        $_POST=array();
        //header("Location:index.php");
        //exit();
    }
  }
?>
<form method="post">
<fieldset>
  <legend>Student Information</legend>
  Number of fields: <input type="text" name="rows" value="<?php echo $rows; ?>"><br />
  Total number of characters: <input type="text">
  <input type="submit" name="submit" value="Update"/>
  <br>
  <br>
  <table border="1">
    <th></th>
    <th>field</th>
    <th>number of characters</th>
    <?php
        for($loop=1;$loop<=$rows;$loop++)
        {
            echo '<tr>';
            echo '<td>'.$loop.'</td>';
            echo '<td><input name="field['.$loop.']" value="'.$_POST['field'][$loop].'" /></td>';
            echo '<td><input name="chars['.$loop.']" value="'.$_POST['chars'][$loop].'" /></td>';
            echo '</tr>';
        }
    ?>
  </table>
  <input type="submit" name="submit" value="Submit"/>
  </fieldset>
</form>

デフォルトは 2 行 (最小) で、行を更新してもデータは保持されます。
行が減ると、最後の行が消えます

于 2013-07-11T15:55:22.670 に答える
1

もちろん、PHPだけでも可能です。

たとえば、「6」行を入力した場合、フォーム投稿をキャッチして次のようなことを行うことができます (HTML 内のテンプレート フォーム):

<?php for($i=0; $<=$_POST['rows'];$i++): ?>
<!-- This being your whatever html for the table -->
<tr><td></td></tr>

<?php endfor; ?>
于 2013-07-11T15:44:45.573 に答える