อยากให้นำเสนอการค้างค่าของหัวข้อ Combobox เลือก จังหวัด อำเภอ ตำ HomeForumอยากให้นำเสนอการค้างค่าของหัวข้อ Combobox เลือก จังหวัด อำเภอ ตำ pusiri พอดีอยากจะนำมาประยุกค์ใช้กับ web แต่เป็นมือใหม่เลยยังไม่ค่อยรู้เรื่องง่ะคับ กรกฎ วิริยะ งง กะคำถามจริงๆ yukungs@hotmail.com คือปัญหามันมีอยู่ว่า ผมนำ code ที่พี่เผยแพร่ใน web ที่เป็นหัวข้อ combobox เลือก จังหวัด อำเภอ ตำบล ตาม link นี้ง่ะคับ www.goragod.com/knowledge-GAJAX%20%E0%B8%9A%E0%B8%97%E0%B8%97%E0%B8%B5%E0%B9%88%2010.html คือผมนำไปใช้ในหน้า add ข้อมูลทุกอย่างไม่มีปัญหา แต่ตอนนี้ติดปัญหาอยู่ตรงการที่จะดึงข้อมูลกลับมาโชว์ในหน้า Edit ส่วนที่เป็น combobox ขึ้นมาโชว์เพื่อที่จะสามารถแก้ไขง่ะ คับ ผมไม่รู้ว่าจะทำยังไงให้ค่าที่เคยเลือกไว้นั้นโชว์ง่ะคับ กรกฎ วิริยะ ไปดูหัวข้อไหนเนี่ย http://www.goragod.com/knowledge-Combobox%20เลือก%20จังหวัด%20อำเภอ%20ตำบล%20(UTF-8).html?search=ตำบล%20จังหวัด เมื่อ submit แล้วมันก็ยังแสดงค่าที่เลือกไว้ได้นี่ ลองทำไปตามตัวอย่าง yukungs@hotmail.com และถ้าเป็นกรณีในการที่ลงเก็บ id ของ จังหวัด อำเภอ และตำบล ไปแล้ว เราต้องการนำมันขึ้นมาโชว์ในหน้าของการแก้ไขข้อมูล จาก code นี้ //index.php <? echo "<form action=\"?\" method=\"post\">\n"; echo '<span id="provinceDiv">'; echo "<label for=\"province\">จังหวัด :</label><select name=\"province\" id=\"province\" onchange=\"dochange('province')\">\n"; echo "<option value=\"$province\">--------------</option> \n" ; echo "</select></span>\n"; ?> <br> <? echo '<span id="amphurDiv">'; echo "<label for=\"amphur\">อำเภอ :</label><select name=\"amphur\" id=\"amphur\" onchange=\"dochange('amphur')\">\n"; echo "<option value=\"$amphur\">--------------</option> \n" ; echo "</select></span>\n"; ?> <br> <? echo '<span id="tumbonDiv">'; echo "<label for=\"tumbon\">ตำบล :</label><select name=\"tumbon\" id=\"tumbon\">\n"; //รายการสุดท้ายไม่ต้องมี event แล้ว echo "<option value=\"$tumbon\">--------------</option> \n" ; echo "</select></span>\n"; ?> <script type="text/javascript"> //AJAX function Inint_AJAX() { try { return new ActiveXObject( "Msxml2.XMLHTTP" ); } catch ( e ) { }; try { return new ActiveXObject( "Microsoft.XMLHTTP" ); } catch ( e ) { }; try { return new XMLHttpRequest(); } catch ( e ) { }; alert( "XMLHttpRequest not supported" ); return null; }; function dochange( obj ) { var req = Inint_AJAX(); var province = document.getElementById( 'province' ).value; var tumbon = document.getElementById( 'tumbon' ).value; if ( obj && obj.name == 'province' ) //เมื่อทำการเลือกที่จังหวัดมา ให้เคลียร์ค่าอำเภอ { var amphur = ""; } else //เลือกรายการอื่น { var amphur = document.getElementById( 'amphur' ).value; }; var data = "province=" + province + "&hur=" + amphur + "&tumbon=" + tumbon; req.onreadystatechange = function() { if ( req.readyState == 4 ) { if ( req.status == 200 ) { var datas = eval( '(' + req.responseText + ')' ); // JSON document.getElementById( 'provinceDiv' ).innerHTML = datas[0].province; document.getElementById( 'amphurDiv' ).innerHTML = datas[0].amphur; document.getElementById( 'tumbonDiv' ).innerHTML = datas[0].tumbon; }; }; }; req.open( "post" , "province.php" , true ); //สร้าง connection req.setRequestHeader( "Content-Type", "application/x-www-form-urlencoded" ); // set Header req.send( data ); //ส่งค่า }; //โหลดครั้งแรก window.onload = function() { dochange( '' ); }; </script> //province.php <? header( "Expires: Sat, 1 Jan 2005 00: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: application/x-javascript; charset=tis-620" ); $province = $_POST[province]; $amphur = $_POST[amphur]; $tumbon = $_POST[tumbon]; $hostname_conn = "localhost"; $username_conn = "root"; $password_conn = "password"; $database_conn = "ehome"; mysql_connect( $hostname_conn , $username_conn , $password_conn ) or die( "เชื่อมต่อฐานข้อมูลไม่ได้" ); mysql_select_db( $database_conn ) or die( "เลือกฐานข้อมูลไม่ได้" ); // เลือกฐานข้อมูล $SQL = "set names tis620"; mysql_query($SQL); //ให้คืนค่าจังหวัดไว้เป็นอันดับแรก $sql = "SELECT id, name FROM province"; $result = mysql_query( $sql ); echo "[{\"province\":\""; echo "<label for='province'>จังหวัด :</label>"; echo "<select name='province' id='province' onchange='dochange(this)'>"; echo "<option value='0'>--กรุณาเลือกจังหวัด--</option>"; while( $fetcharr = mysql_fetch_array( $result ) ) { $id = $fetcharr[id]; $name = $fetcharr[name]; echo "<option value='$id'"; if ( $province == $id ) //เลือกจังหวัดที่เลือกไว้ { echo " selected='selected'"; }; echo ">$name</option>"; }; echo "</select>\",\"amphur\":\""; echo "<label for='amphur'>อำเภอ :</label>"; echo "<select name='amphur' id='amphur' onchange='dochange(this)'>"; //ถ้ามีการเลือกจังหวัดมาแล้วให้แสดงอำเภอต่อ if ( $province != "0" && $province != "" ) { echo "<option value='0'>--กรุณาเลือกอำเภอ--</option>"; $sql = "SELECT id, name FROM amphur WHERE provinceID='$province'"; $result = mysql_query( $sql ); while( $fetcharr = mysql_fetch_array( $result ) ) { $id = $fetcharr[id]; $name = $fetcharr[name]; echo "<option value='$id'"; if ( $amphur == $id ) //เลือกอำเภอที่เลือกไว้ { echo " selected='selected'"; }; echo ">$name</option>"; }; } else { echo "<option value=''>--------------</option>"; }; echo "</select>\",\"tumbon\":\""; echo "<label for='tumbon'>ตำบล :</label>"; echo "<select name='tumbon' id='tumbon'>"; //ถ้ามีการเลือกอำเภอมาแล้วให้แสดงตำบลต่อ if ( $amphur != "0" && $amphur != "" ) { echo "<option value='0'>--กรุณาเลือกตำบล--</option>"; $sql = "SELECT id, name FROM tumbon WHERE amphurID=$amphur"; $result = mysql_query( $sql ); while( $fetcharr = mysql_fetch_array( $result ) ) { $id = $fetcharr[id]; $name = $fetcharr[name]; echo "<option value='$id'"; if ( $tumbon == $id ) //เลือกตำบลที่เลือกไว้ { echo " selected='selected'"; }; echo ">$name</option>"; }; } else { echo "<option value=''>--------------</option>"; }; echo "</select>\"}]"; mysql_close(); ?> ตัวอย่างถ้าเราอยากจะให้มันโชว์ค่าตามที่เราเลือกไว้แล้วในหน้า add ความคิดเห็น รายละเอียด ไฟล์อัปโหลด ชนิด jpg, jpeg ขนาดไฟล์ไม่เกิน 2M ส่งความคิดเห็น
www.goragod.com/knowledge-GAJAX%20%E0%B8%9A%E0%B8%97%E0%B8%97%E0%B8%B5%E0%B9%88%2010.html
คือผมนำไปใช้ในหน้า add ข้อมูลทุกอย่างไม่มีปัญหา แต่ตอนนี้ติดปัญหาอยู่ตรงการที่จะดึงข้อมูลกลับมาโชว์ในหน้า Edit ส่วนที่เป็น combobox ขึ้นมาโชว์เพื่อที่จะสามารถแก้ไขง่ะ คับ ผมไม่รู้ว่าจะทำยังไงให้ค่าที่เคยเลือกไว้นั้นโชว์ง่ะคับ
http://www.goragod.com/knowledge-Combobox%20เลือก%20จังหวัด%20อำเภอ%20ตำบล%20(UTF-8).html?search=ตำบล%20จังหวัด
เมื่อ submit แล้วมันก็ยังแสดงค่าที่เลือกไว้ได้นี่ ลองทำไปตามตัวอย่าง
และถ้าเป็นกรณีในการที่ลงเก็บ id ของ จังหวัด อำเภอ และตำบล ไปแล้ว เราต้องการนำมันขึ้นมาโชว์ในหน้าของการแก้ไขข้อมูล จาก code นี้
//index.php
<?
echo "<form action=\"?\" method=\"post\">\n";
echo '<span id="provinceDiv">';
echo "<label for=\"province\">จังหวัด :</label><select name=\"province\" id=\"province\" onchange=\"dochange('province')\">\n";
echo "<option value=\"$province\">--------------</option> \n" ;
echo "</select></span>\n";
?> <br>
<?
echo '<span id="amphurDiv">';
echo "<label for=\"amphur\">อำเภอ :</label><select name=\"amphur\" id=\"amphur\" onchange=\"dochange('amphur')\">\n";
echo "<option value=\"$amphur\">--------------</option> \n" ;
echo "</select></span>\n";
?> <br>
<?
echo '<span id="tumbonDiv">';
echo "<label for=\"tumbon\">ตำบล :</label><select name=\"tumbon\" id=\"tumbon\">\n"; //รายการสุดท้ายไม่ต้องมี event แล้ว
echo "<option value=\"$tumbon\">--------------</option> \n" ;
echo "</select></span>\n";
?>
<script type="text/javascript">
//AJAX
function Inint_AJAX()
{
try
{
return new ActiveXObject( "Msxml2.XMLHTTP" );
}
catch ( e )
{
};
try
{
return new ActiveXObject( "Microsoft.XMLHTTP" );
}
catch ( e )
{
};
try
{
return new XMLHttpRequest();
}
catch ( e )
{
};
alert( "XMLHttpRequest not supported" );
return null;
};
function dochange( obj )
{
var req = Inint_AJAX();
var province = document.getElementById( 'province' ).value;
var tumbon = document.getElementById( 'tumbon' ).value;
if ( obj && obj.name == 'province' ) //เมื่อทำการเลือกที่จังหวัดมา ให้เคลียร์ค่าอำเภอ
{
var amphur = "";
}
else //เลือกรายการอื่น
{
var amphur = document.getElementById( 'amphur' ).value;
};
var data = "province=" + province + "&hur=" + amphur + "&tumbon=" + tumbon;
req.onreadystatechange = function()
{
if ( req.readyState == 4 )
{
if ( req.status == 200 )
{
var datas = eval( '(' + req.responseText + ')' ); // JSON
document.getElementById( 'provinceDiv' ).innerHTML = datas[0].province;
document.getElementById( 'amphurDiv' ).innerHTML = datas[0].amphur;
document.getElementById( 'tumbonDiv' ).innerHTML = datas[0].tumbon;
};
};
};
req.open( "post" , "province.php" , true ); //สร้าง connection
req.setRequestHeader( "Content-Type", "application/x-www-form-urlencoded" ); // set Header
req.send( data ); //ส่งค่า
};
//โหลดครั้งแรก
window.onload = function()
{
dochange( '' );
};
</script>
//province.php
<?
header( "Expires: Sat, 1 Jan 2005 00: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: application/x-javascript; charset=tis-620" );
$province = $_POST[province];
$amphur = $_POST[amphur];
$tumbon = $_POST[tumbon];
$hostname_conn = "localhost";
$username_conn = "root";
$password_conn = "password";
$database_conn = "ehome";
mysql_connect( $hostname_conn , $username_conn , $password_conn ) or die( "เชื่อมต่อฐานข้อมูลไม่ได้" );
mysql_select_db( $database_conn ) or die( "เลือกฐานข้อมูลไม่ได้" ); // เลือกฐานข้อมูล
$SQL = "set names tis620";
mysql_query($SQL);
//ให้คืนค่าจังหวัดไว้เป็นอันดับแรก
$sql = "SELECT id, name FROM province";
$result = mysql_query( $sql );
echo "[{\"province\":\"";
echo "<label for='province'>จังหวัด :</label>";
echo "<select name='province' id='province' onchange='dochange(this)'>";
echo "<option value='0'>--กรุณาเลือกจังหวัด--</option>";
while( $fetcharr = mysql_fetch_array( $result ) )
{
$id = $fetcharr[id];
$name = $fetcharr[name];
echo "<option value='$id'";
if ( $province == $id ) //เลือกจังหวัดที่เลือกไว้
{
echo " selected='selected'";
};
echo ">$name</option>";
};
echo "</select>\",\"amphur\":\"";
echo "<label for='amphur'>อำเภอ :</label>";
echo "<select name='amphur' id='amphur' onchange='dochange(this)'>";
//ถ้ามีการเลือกจังหวัดมาแล้วให้แสดงอำเภอต่อ
if ( $province != "0" && $province != "" )
{
echo "<option value='0'>--กรุณาเลือกอำเภอ--</option>";
$sql = "SELECT id, name FROM amphur WHERE provinceID='$province'";
$result = mysql_query( $sql );
while( $fetcharr = mysql_fetch_array( $result ) )
{
$id = $fetcharr[id];
$name = $fetcharr[name];
echo "<option value='$id'";
if ( $amphur == $id ) //เลือกอำเภอที่เลือกไว้
{
echo " selected='selected'";
};
echo ">$name</option>";
};
}
else
{
echo "<option value=''>--------------</option>";
};
echo "</select>\",\"tumbon\":\"";
echo "<label for='tumbon'>ตำบล :</label>";
echo "<select name='tumbon' id='tumbon'>";
//ถ้ามีการเลือกอำเภอมาแล้วให้แสดงตำบลต่อ
if ( $amphur != "0" && $amphur != "" )
{
echo "<option value='0'>--กรุณาเลือกตำบล--</option>";
$sql = "SELECT id, name FROM tumbon WHERE amphurID=$amphur";
$result = mysql_query( $sql );
while( $fetcharr = mysql_fetch_array( $result ) )
{
$id = $fetcharr[id];
$name = $fetcharr[name];
echo "<option value='$id'";
if ( $tumbon == $id ) //เลือกตำบลที่เลือกไว้
{
echo " selected='selected'";
};
echo ">$name</option>";
};
}
else
{
echo "<option value=''>--------------</option>";
};
echo "</select>\"}]";
mysql_close();
?>
ตัวอย่างถ้าเราอยากจะให้มันโชว์ค่าตามที่เราเลือกไว้แล้วในหน้า add