ใช้งาน Combobox 2 ตัวที่สัมพันธ์กัน (Javascript)

โค้ดเป็นการแสดงรายการใน Combobox 2 ตัวที่สัมพันธ์กัน โดยครั้งแรกเมื่อเรียกหน้ามาแสดง จะไปอ่านข้อมูล สายงาน มาแสดง จากตาราง class_tb ลงใน Combobox ชื่อ class ซึ่งเมื่อ user ทำการเลือกสายงานใน Combobox ตัวนี้ จะเกิด event onChange ไปเรียกฟังก์ชั่นของ Javascript ชื่อ class_select มาทำงานโดยการส่งค่า value ไปพร้อมกับ function ด้วย โดยที่ในฟังก์ชั่น class_select จะไปเรียกหน้านี้มาทำงานอีกครั้งโดยส่งค่า classid ที่เลือก ไปด้วย ซึ่งในการส่งไปครั้งที่ 2 ตัวแปร $_GET[classid] จะมีค่า ซึ่งจะไปทำให้เกิดการเรียก รายการ ประเภทของสื่อ มาแสดงต่อไป

<? 

  $ServerName="localhost"; 

  $UserName="root"; // กำหนด User ของ MySQL

  $UserPassword=""; // กำหนดรหัสผ่านของ MySQL

  $DatabaseName="mydb"; // กำหนดชื่อ Database

  

  //สร้าง Connection ติดต่อกับ MySQL Server เก็บไว้ที่ตัวแปร $conn

  $conn = mysql_connect($ServerName, $UserName, $UserPassword);

  if (!$conn) die("ไม่สามารถติดต่อกับ MySQL ได้");

  mysql_query("SET NAMES tis620"); 

  

  //เลือกใช้งานฐานข้อมูลที่กำหนดไว้ที่ตัวแปร $DatabaseName

  mysql_select_db($DatabaseName, $conn) or die("ไม่สามารถเลือกใช้งานฐานข้อมูล $DatabaseName ได้");

  

  //ค่าที่ส่งมาเมื่อเลือกสายงาน

  $classid=$_GET[classid];



  //แสดงรายการ สายงาน

  $select_class="select * from class_tb order by class_id ";

  $query_class = mysql_query($select_class, $conn);



  echo "<select name=class onChange='class_select(this.value)'>";

  echo "<option>- เลือกสายงาน -</option>
";

  while ($rs_class = mysql_fetch_array($query_class)) {

    $class_id=$rs_class[class_id];

    $class_name=$rs_class[class_name];

    echo "<option value='$class_id'";

    if ($class_id==$classid) echo " selected"; //เลือกรายการที่ส่งมา

    echo ">$class_name</option>
"; 

  } 

  echo "</select>";



  //แสดงรายการ ประเภทของสื่อ

  if ($classid!='') { //มีการส่ง $classid มาด้วย

    $select_line="select * from news_line_tb where class_id=$classid ";

    $query_line = mysql_query($select_line,$conn);



    echo "<select name=news_line>";

    echo "<option>- เลือกประเภทของสื่อ -</option>
";

    while ($rs_line = mysql_fetch_array($query_line)) {

      $newsl_id=$rs_line[newsl_id];

      $newsl_name=$rs_line[newsl_name];

      $class_id_newsl=$rs_line[class_id];

      echo "<option value='$newsl_id'>$newsl_name</option>
"; 

    } 

    echo "</select>";

  }

?>

<script language=Javascript>

//เมื่อเลือก สายงาน

function class_select(id) {

  document.URL='?classid='+id;

}

</script>