|
 |
| |
โค้ดJavaScript สร้าง selectbox ดึงข้อมูลจากฐานข้อมูล เมื่อกดปุ่ม create แล้วให้สร้าง selectbox อีกอัน ดัดแปลงมาจากการสร้าง textbox |
| |
 |
|
|
 |
 |
|
ลองดู JQuery ครับคิดว่าอาจจะตรงกับความต้องการหรือเปล่าไม่แน่ใจแต่ก็ลองดูนะเพื่อได้แนวทาง
โดยการทำงานจะเลือกตัวเลือกจากลิสบ๊อกแล้วจะแสดงคำถามที่พร้อมตัวเลือกมาให้
(ตอบจากความเข้าใจไม่รู้ตรงเปล่านะครับ)
ถ้าไม่ตรงยังไงช่วยอธิบายเพิ่มหน่ยนะครับ
ส่อนเรื่องการนำค่าจากลิสไปใช้โดยส่วนตัวใช้ประมาณนี้ครับ
แบบ array
ทำการนับจำนวนค่าที่ส่งมาใน array แล้วใช้ while หรือ for เพื่อทำการถอดค่าจาก array
ครับแล้วก็แยกค่าออกมา โดยใช้ $_Post["DATA"][$i] หลังจากนั้นก็นำไปสร้างคำสั่ง
sql แล้วก็ query
ก่อนอื่นดาวน์โหลด jQuery มาก่อน
http://code.jquery.com/jquery-1.4.4.js
test.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874" />
<title>Untitled Document</title>
<link href="css/css.css" rel="stylesheet" type="text/css" />
<script language="javascript" src="jquery-1.4.2.min.js"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
function newXmlHttp(){
var xmlhttp = false;
try{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
xmlhttp = false;
}
}
if(!xmlhttp && document.createElement){
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
function num2text(){
var id = document.form1.id.value;
var url = "listbox.php?id="+id
xmlhttp = newXmlHttp();
xmlhttp.open("GET", url, true);
xmlhttp.send(null);
$("document").ready( function(){
$("#numtxt").hide("fastest",function(){
$("#numtxt").show("fastest");
document.getElementById("numtxt").innerHTML = xmlhttp.responseText;
});
});
}
//-->
</SCRIPT>
</head>
<body>
<table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
<form name="form1"><tr>
<td>เลือกคำถาม<br>
<select name="id" onchange="num2text();">
<option value="1">ข้อ1</option>
<option value="2">ข้อ 2</option>
<option value="3">ข้อ 3</option>
<option value="4">ข้อ 4</option>
</select>
</label></td>
</tr></form>
</table>
<table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><strong>โปรดเลือกคำถามจากตัวเลือกด้านล่าง</strong><br>
<br>
<div id="numtxt" ><font color="#FF0000">
ยังไม่ได้กรอกข้อมูลจ้า<br>
</font></div></td>
</tr>
</table>
</body>
</html>
listbox.php
<?
header('Content-Type: text/html; charset=tis-620');
$id = $HTTP_GET_VARS["id"];
echo "ข้อที่ ".$id;
switch($id){
case 1 :
echo ' <select name="No1" >
<option value="1">ตัวเลือกข้อ1</option>
<option value="2">ตัวเลือกข้อ 2</option>
<option value="3">ตัวเลือกข้อ 3</option>
<option value="4">ตัวเลือกข้อ 4</option>
</select>';
break;
case 2 :
echo ' <select name="No2" >
<option value="1">ตัวเลือกข้อ1</option>
<option value="2">ตัวเลือกข้อ 2</option>
<option value="3">ตัวเลือกข้อ 3</option>
<option value="4">ตัวเลือกข้อ 4</option>
</select>';
break;
case 3 :
echo ' <select name="No3" >
<option value="1">ตัวเลือกข้อ1</option>
<option value="2">ตัวเลือกข้อ 2</option>
<option value="3">ตัวเลือกข้อ 3</option>
<option value="4">ตัวเลือกข้อ 4</option>
</select>';
break;
case 4 :
echo ' <select name="No4" >
<option value="1">ตัวเลือกข้อ1</option>
<option value="2">ตัวเลือกข้อ 2</option>
<option value="3">ตัวเลือกข้อ 3</option>
<option value="4">ตัวเลือกข้อ 4</option>
</select>';
break;
}
?>
|
ประวัติการแก้ไข
2010-11-17 23:34:38
2010-11-17 23:47:16
 |
 |
 |
 |
| Date :
2010-11-17 23:29:17 |
By :
komson94 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
^-^ ขอบคุณนะค่ะ แต่ว่าไม่ใช่อย่างที่ต้องการอ่าค่ะ คือแบบว่าต้องการให้เมื่อกดเพิ่ม แล้ว เมนู selectbox จะเกิดขึ้นอีกอันหน่ะค่ะ โดยที่มันจะมีลิสต์เมนูเหมือนอันแรกทุกประการ คือให้เพิ่มได้ลบได้ เพราะต้องการนำไปใช้ ในการเพิ่มคำถาม ซึ่ง 1 เพจจะมีหลายๆคำถาม แต่ให้ user เลือกเอาหน่ะค่ะ จากฐานข้อมูล แบบว่า selectbox อันแรก คือคำถามข้อที่ 1 ถ้ากดเพิ่ม จะเกิด selectbox ใหม่ เพื่อเลือก คำถามข้อสอง ไม่ใช่แบบที่คุณ kom ตอบมาอ่าค่ะ ซึ่งจะนำค่าแต่ละ selectbox นี้ไปใช้หน่ะค่ะ 
|
| |
|
|
| |
| Date :
2010-11-19 18:36:38 |
By :
nuie |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
จาก script ของ mr.win นำมาดัดแปลงแล้วได้แบบนี้คับพร้อม sql คิดว่าแบบนี้น่าจะใกล้เคียงนะครับ
Code (PHP)
<?php
if($_POST){
$data = "Column5_".$i;
$total = $_POST['hdnMaxLine'];
$total++;
$i=1;
while($i<=$total){
$val = $_POST["Column5_".$i];
echo $sql."<br>";
$sql = "INSERT INTO `customer` (`CustomerID` ,`Name` ,`Email` ,`CountryCode` ,`Budget` ,`Used` )
VALUES ('', '$val', 'DATA', 'DATA', 'DATA', 'DATA')";
$i++;
}
}
?>
<html>
<head>
<title>ThaiCreate.Com JavaScript Add/Remove Element</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<?
mysql_connect("localhost","root","1234");
mysql_select_db("mydatabase");
$strSQL = "SELECT * FROM customer";
$objQuery = mysql_query($strSQL);
?>
<script language="javascript">
function CreateSelectOption(ele)
{
var objSelect = document.getElementById(ele);
var Item = new Option("", "");
objSelect.options[objSelect.length] = Item;
<?
while($objResult = mysql_fetch_array($objQuery))
{
?>
var Item = new Option("<?=$objResult["Name"];?>", "<?=$objResult["CustomerID"];?>");
objSelect.options[objSelect.length] = Item;
<?
}
?>
}
function CreateNewRow()
{
var intLine = parseInt(document.frmMain.hdnMaxLine.value);
intLine++;
var theTable = document.all.tbExp
var newRow = theTable.insertRow(theTable.rows.length)
newRow.id = newRow.uniqueID
var newCell
//*** Column 5 ***//
newCell = newRow.insertCell(0);
newCell.id = newCell.uniqueID;
newCell.setAttribute("className", "css-name");
newCell.innerHTML = "<center><SELECT NAME=\"Column5_"+intLine+"\"></SELECT></center>";
//*** Create Option ***//
CreateSelectOption("Column5_"+intLine)
document.frmMain.hdnMaxLine.value = intLine;
}
function RemoveRow()
{
intLine = parseInt(document.frmMain.hdnMaxLine.value);
if(parseInt(intLine) > 0)
{
theTable = (document.all) ? document.all.tbExp :
document.getElementById("tbExp")
theTableBody = theTable.tBodies[0];
theTableBody.deleteRow(intLine);
intLine--;
document.frmMain.hdnMaxLine.value = intLine;
}
}
</script>
<body">
<form name="frmMain" method="post">
<table width="445" border="1" id="tbExp">
<tr>
<td><div align="center">Column 1 </div></td>
</tr>
</table>
<input type="hidden" name="hdnMaxLine" value="0">
<input name="btnAdd" type="button" id="btnAdd" value="+" onClick="CreateNewRow();">
<input name="btnDel" type="button" id="btnDel" value="-" onClick="RemoveRow();">
<label>
<input type="submit" name="Submit" value="SEND">
</label>
</form>
</body>
</html>
Code
database
CREATE TABLE `customer` (
`CustomerID` varchar(4) NOT NULL,
`Name` varchar(50) NOT NULL,
`Email` varchar(50) NOT NULL,
`CountryCode` varchar(2) NOT NULL,
`Budget` double NOT NULL,
`Used` double NOT NULL,
PRIMARY KEY (`CustomerID`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;
--
-- Dumping data for table `customer`
--
INSERT INTO `customer` VALUES ('C001', 'Win Weerachai', '[email protected]', 'TH', 1000000, 600000);
INSERT INTO `customer` VALUES ('C002', 'John Smith', '[email protected]', 'EN', 2000000, 800000);
INSERT INTO `customer` VALUES ('C003', 'Jame Born', '[email protected]', 'US', 3000000, 600000);
INSERT INTO `customer` VALUES ('C004', 'Chalee Angel', '[email protected]', 'US', 4000000, 100000);
|
| |
|
|
| |
| Date :
2010-11-19 21:33:04 |
By :
komson94 |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 04
|
