|
 |
|
ใครทำ expanding form ของ dropdownlist เป็นมั่งคะ คือเราอยากให้ click แล้วเพิ่ม dropdownlist ของจังหวัดและสถานที่ท่องเที่ยวได้เรื่อยๆอ่ะค่ะ |
|
 |
|
|
 |
 |
|
คือเราอยากให้ click แล้วเพิ่ม dropdownlist ของจังหวัดและสถานที่ท่องเที่ยวได้เรื่อยๆอ่ะค่ะ ตอนนี้ทำได้แค่ลด อยากได้แบบในเว็บนี้เลยค่ะ http://www.quirksmode.org/dom/domform.html
แต่ว่าทำตามเว็บแล้วมันไม่ได้ผลอ่ะค่ะ ใครทำเป็นช่วยดูโค้ดให้หน่อยนะคะ >_<
Code (PHP)
<?
require_once('connectdb.php');
mysql_query("SET NAMES tis620",$conn);
mysql_select_db($dbname,$conn) or die("ติดต่อฐานข้อมูลไม่ได้");
?>
<html>
<head>
<title>place</title>
</head>
<script type="text/javascript">
var HttPRequest = false;
function doCallAjax(val) {
HttPRequest = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
HttPRequest = new XMLHttpRequest();
if (HttPRequest.overrideMimeType) {
HttPRequest.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
HttPRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
HttPRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!HttPRequest) {
alert('Cannot create XMLHTTP instance');
return false;
}
var url = 'place.php';
var pmeters = 'province='+val
//var pmeters = 'myName='+document.getElementById("txtName").value+'&my2='; // 2 Parameters
HttPRequest.open('POST',url,true);
HttPRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
HttPRequest.setRequestHeader("Content-length", pmeters.length);
HttPRequest.setRequestHeader("Connection", "close");
HttPRequest.send(pmeters);
HttPRequest.onreadystatechange = function()
{
if(HttPRequest.readyState == 4) // Return Request
{
var text =HttPRequest.responseText;
var arr =new Array();
arr =text.split('|')
//alert(text);
document.getElementById('PlaceID').innerHTML='';
document.getElementById('PlaceID').options[0]=new Option( "- เลือกสถานที่ท่องเที่ยว -","",false,false);
len=1;
if(arr.length==1)return;
for(i=0;i<arr.length;i++){
document.getElementById('PlaceID').options[len]=new Option( (arr[i+1]),(arr[i++]),false,false);
len++;
}
}
}
}
</script>
<script type="text/javascript">
var counter = 0;
function moreFields() {
counter++;
var newFields = document.getElementById('readroot').cloneNode(true);
newFields.id = '';
newFields.style.display = 'block';
var newField = newFields.childNodes;
for (var i=0;i<newField.length;i++) {
var theName = newField[i].name
if (theName)
newField[i].name = theName + counter;
}
var insertHere = document.getElementById('writeroot');
insertHere.parentNode.insertBefore(newFields,insertHere);
}
window.onload = moreFields;
</script>
<body>
<div id="readroot" style="display: none">
<br />
<br />
<select name="Province" id="ProvinceID" onChange="doCallAjax(this.value)" style="width:200px">
<option value="0" selected = "selected">- เลือกจังหวัด -</option>
<?
$sql="select * from prodesc order by ProvinceID ASC";
$dbquery=mysql_db_query($dbname,$sql);
while($result=mysql_fetch_array($dbquery)){
if($Province_ID == $result[ProvinceID]){
?>
<option value="<?=$result[ProvinceID];?>">
<?=$result[ProvinceName];?>
</option>
<?
}
else{
?>
<option value="<?=$result[ProvinceID];?>">
<?=$result[ProvinceName];?>
</option>
<?
}
}
?>
</select>
<select name="Place" id="PlaceID" style="width:200px">
<option value="" selected="selected">- เลือกสถานที่ท่องเที่ยว -</option>
</select>
</div>
<form name="form1" method="post" action="">
<span id="writeroot"></span>
<input type="button" id="moreFields" value="เพิ่ม"/>
<input type="button" value="ลด"
onClick="this.parentNode.parentNode.removeChild(this.parentNode);" />
<input type="submit" value="ตกลง" />
<label></label>
<label></label>
<label></label>
</form>
</body>
</html>
Tag : - - - -

|
|
 |
 |
 |
 |
Date :
2010-01-26 11:17:32 |
By :
fairy |
View :
958 |
Reply :
1 |
|
 |
 |
 |
 |
|
|
|
 |
 |
|
 |
 |
|
|

|
Load balance : Server 01
|