php - jQuery：最初のドロップダウンの値に基づく配列からの2番目のドロップダウン

Question

質問： 2つのドロップダウンボックスがあります。jQueryを使用して、最初のドロップダウンボックスを選択したときに2番目のドロップダウンボックスにデータを入力したいと思います（既存のコードのヘルプ）。以下のjQueryコードでヘルプが必要な領域にマークを付け、さらに「コードヘルプ」で達成したいことの説明を付けました。

これはSOで非常に頻繁にリクエストされるアイテムであり、これは単純なJSで実行できるというコメントをたくさん見ましたが、ページではすでに他のjQuery要素が使用されているため（私はコーディングしていません）、簡単にするために、 JQを使いたい。

私はjQueryコードにまったく慣れていません。多くの例を調べましたが、JSまたはJQのコーディング規則に精通していないため、ロジックに迷い込んでいます。そのため、物事をシンプルに保つことが重要です。コード（コードを機能させるためのヘルプを探しているだけでなく、何が起こっているのかを学び、理解することもできます）。

http://jqueryfordesigners.com/populate-select-boxes/のチュートリアルに従って、達成したい操作をほぼ正確に見つけました（以下の「コードヘルプ」で説明されている1つの重要なポイントを除く） 。操作を示すサンプルページはここにあります：http：//jqueryfordesigners.com/demo/select-boxes.html

コードヘルプ：チュートリアルでは、2番目のドロップダウンは静的htmlファイルのコンテンツから入力されます：最初のドロップダウンで選択した値に基づいて$article.load('select-boxes-' + categoryName + '.html');
、JS変数$st_listとPHP変数から2番目のドロップダウンを入力する必要があります。$student_block以下の私のコード。

誰かがそれを実現するためにコードを適応させる方法を手伝ってもらえますか？

ありがとうございました

私のコード：
簡単にするために、最初のドロップダウンは単純な整数値で静的ですが、$test_seq以下のサンプルコードと同じ整数値で作業コードのDBから入力されます（それが重要な場合）。さらに、別のPHPプロセス（後で）では$test_seq、$student_idおよびその他new variablesを使用してデータをDBに送り返します（この要求には関係ありませんが、参照用にのみ含まれています）。

select-boxes.php

$sql = "SELECT * FROM TBL_NAME";
$result = mysql_query($sql) or die(mysql_error());
while($row = mysql_fetch_array( $result ))
{
  $test_seq = $row['SEQ'];
  $student_id = $row['st_num'];
  $student_name = $row['st_name'];
  $student_block .= '<OPTION value="'.$student_id.'">'.$student_id.' - '.$student_name.'</OPTION>';
}     

形：

<form action="select-boxes.php">
<label for="test_day">Test day:</label>
   <select name="test_day" id="test_day">
    <option selected value="">&nbsp;</option>
    <option value="1">Day 1</option>
    <option value="2">Day 2</option>
    <option value="3">Day 3</option>
   </select>
<input type="submit" id="next" value="next &raquo;" />
</form>

jQuery：

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
  $(document).ready(function () {
    var $test_day = $('#test_day'),
    $st_list = null;
    $test_day.change(function () {
      var test_dayVal = $test_day.val();
      if ($st_list == null) {
        $st_list = $('<select name="st_name" id="st_name"><?php echo $student_block; ?></select>').appendTo('form');
        $next.remove();
        $('form').append('<input type="submit" value="process &raquo;" />');
      }

      $st_list.load('#test_dayVal'); //<--I think this is where I need help.. What do I do here?

    });

    var $next = $('#next');

    $next[0].setAttribute('type', 'button');
  });
</script>