ภาษาไทย ใน ComboBox กับ Ajax ครับ

สวัสดีครับคุณ Goragod

ผมชอบวิธีการที่คุณ Goragod นำเสนอเกี่ยวกับการเลือก Combo Box อันแรก และให้ Query เฉพาะค่าที่เกี่ยวกับกับอันแรกแสดงใน Combo Box ที่สองและที่สามตามลำดับ ผมลองนำ Code มาใช้ แต่ติดปัญหาเรื่องภาษาไทย และพยายามอ่านกระทู้อื่นๆ ที่คุณ Goragod นำเสนอเกี่ยวกับการแก้ปัญหาภาษาไทย แต่ไม่เป็นผลครับ (พยายามมาหลายวัน)

จึงอยากรบกวนให้คุณ Goragod ช่วยแนะนำหน่อยนะครับ

index.php

<?  
   error_reporting(0);
 header("Content-type: text/html; charset=utf-8");
 header("content-type: application/x-javascript; charset=utf-8");
 
   //ค่าที่ได้รับมาจากการ Submit
   $amphur=$_POST['amphur'];
   $tumbon=$_POST['tumbon'];
   $ban=$_POST['ban'];
 
   if (!empty($amphur)) {
     echo "<br /><br />ค่าที่ได้จากการ Submit คือ :<br /><br />อำเภอที่เลือก : $amphur<br />ตำบลที่เลือก : $tumbon<br />หมู่บ้านที่เลือก : $ban<br /><br /><br /> ";
   }
 
 echo "<form name=sel action='' method=POST> ";
 echo "อำเภอ : <font id=amphur><select> ";
 echo "<option value='0'>--------------------</option> " ;
 echo "</select></font> ";
 
 echo "ตำบล : <font id=tumbon><select> ";
 echo "<option value='0'>--------------------</option> " ;
 echo "</select></font> ";
 
 echo "หมู่บ้าน : <font id=ban><select> ";
 echo "<option value='0'>--------------------</option> " ;
 echo "</select></font> ";
 
 echo "<br /><br /><br />แสดงผลลัพท์การเลือก เป็น ID ของแต่ละรายการ (เพื่อนำไปใช้ต่อ) : <font id=result color=red></font> ";
 echo "<br /><br /><br /><input type=submit value=ส่ง name=submit>";
 echo "</form> ";
?>

<script language=Javascript>
function Inint_AJAX() {
   try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE
   try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE
   try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript
   alert("XMLHttpRequest not supported");
   return null;
};

//dochange จะถูกเรียกเมื่อมีการเลือก รายการ Combobox ซึ่งจะทำให้ไปเรียก AJAX เพื่อร้องขอข้อมูลถัดไปจาก Server
function dochange(src, val) {
  var req = Inint_AJAX();
  req.onreadystatechange = function () {
    if (req.readyState==4) {
      if (req.status==200) {
        document.getElementById(src).innerHTML=req.responseText; //รับค่ากลับมา
      }
    }
  };
  req.open("GET", "province.php?data="+src+"&val="+val); //สร้าง connection
  req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); // set Header
  req.send(null); //ส่งค่า
}

//ฟังก์ชั่นนี้ใช้แสดงผล id ของ Combobox แต่ละตัวที่เลือก
function banchange() {
  document.getElementById('result').innerHTML=sel.amphur.value+', '+sel.tumbon.value+', '+sel.ban.value;
}

//เรียกครั้งแรกไปทำการโหลด อำเภอ มาแสดง
window.onLoad=dochange('amphur', -1);
</script>

province.php

<?
   //กำหนดให้ IE อ่าน page นี้ทุกครั้ง ไม่ไปเอาจาก cache
   header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
   header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
   header ("Cache-Control: no-cache, must-revalidate");
   header ("Pragma: no-cache");
 header ("Content-type: text/html; charset=utf-8");
 header ("content-type: application/x-javascript; charset=UTF-8");
 
 //ค่าที่ถูกส่งมาด้วยจาก AJAX
 $data = $_GET['data'];
 $val = $_GET['val'];
 
 //ค่ากำหนดของ ฐานข้อมูล
 $host = "localhost";
 $username = "root";
 $password = "";
 $dbname = "province";
 
 //เชื่อมต่อกับ MySQL
 $connect= mysql_connect($host, $username, $password) or die("ไม่สามารถเชื่อมต่อฐานข้อมูลได้");
 $db=mysql_select_db($dbname) or die("ฐานข้อมูลไม่ถูกต้อง");
 
 if ($data=='amphur') { //เมื่อมีการโหลดครั้งแรก อ่านข้อมูล อำเภอ
   $sql="select * from amphur order by name asc";
   $result = mysql_query($sql);
   echo "<select name='amphur' onChange=\"dochange('tumbon', this.value)\"> ";
   echo "<option value='0'>-กรุณาเลือกอำเภอ-</option> ";
   echo "<option value='0'>--------------------</option> ";
   while($fetcharr = mysql_fetch_array($result)) {
  $val = $fetcharr['id'];
  $label = $fetcharr['name'];
  echo "<option value=\"$val\">$label</option> " ;
   }
 } else if ($data=='tumbon') { //เมื่อทำการเลือก อำเภอ แสดงข้อมูล ตำบล
   echo "<select name='tumbon' onChange=\"dochange('ban', this.value)\"> ";
   $sql="select * from tumbon where amphurID = '$val'";
   $result = mysql_query($sql);
   echo "<option value='0'>-กรุณาเลือกตำบล-</option> ";
   echo "<option value='0'>--------------------</option> ";
   while($fetcharr = mysql_fetch_array($result)) {
  $val = $fetcharr['id'];
  $label = $fetcharr['name'];
  echo "<option value=\"$val\">$label</option> " ;
   }
 } else if ($data=='ban') { //เมื่อมีการเลือก ตำบล แสดงข้อมูล หมู่บ้าน
   echo "<select name='ban' onChange=\"banchange()\"> ";
   $sql="select * from ban where tum_code = '$val'";
   $result = mysql_query($sql);
   echo "<option value='0'>-กรุณาเลือกหมู่บ้าน-</option> ";
   echo "<option value='0'>--------------------</option> ";
   while($fetcharr = mysql_fetch_array($result)) {
  $val = $fetcharr['ban_code'];
  $label = $fetcharr['ban_name'];
  echo "<option value=\"$val\">$label</option> " ;
   }
 }
 echo "</select> ";
 
?>