[爆卦]php下拉式選單取值是什麼?優點缺點精華區懶人包

為什麼這篇php下拉式選單取值鄉民發文收入到精華區:因為在php下拉式選單取值這個討論話題中,有許多相關的文章在討論,這篇最有參考價值!作者b8211290 (R.V. 紅青菜)看板Ajax標題[問題] AJAX 菜鳥新手發問,關於二層...


各位大大你們好

想請教一下,關於二層式下拉式選單,第一層選定後

要如何 利用 AJAX 把值導出,存進本頁的 PHP 變數裡?

網路上相關的選單範例爬文好久,還是試不太出來

例如:

第一層選單 內容為 批號 A1、A2、A3、A4

我想要將 使用者所選的選項 儲存至 本頁 的 PHP 變數 $select1

然後透過 $select1 的值,要去 MySQL 裡面撈資料,做為 第二層的選項

資料表如下:

id | T_id

A1 | T1
A1 | T2
A1 | T3
A2 | T1
A2 | T2
A3 | T1
A3 | T2
A3 | T3
A3 | T4

小弟在此先感謝各位大大的解答 麻煩各位了 !!!!!!

--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 1.173.77.138
※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1433193715.A.DF1.html
y2468101216: 我覺得你應該搞錯了什麼 ajax取出的資訊是在js裡面 06/02 09:23
y2468101216: http://api.jquery.com/jquery.ajax/ 06/02 09:23
Kenqr: 一開始就把所有第二層選單的資料都撈出來建好選單 06/02 11:58
Kenqr: 否則使用者選好第一層還要等ajax把第二層傳回來 實在太慢 06/02 11:59
b8211290: y大 我知道值是在 js裡,我想知道有沒有辦法讓php讀取 06/02 13:50
b8211290: 到 06/02 13:50
b8211290: k大,我一開始就全撈出來沒有問題,不過第二層選單,我 06/02 13:51
b8211290: 需要隨著第一層選取的項目跟著變化 06/02 13:51
b8211290: 例如 選 A1 要出現 T1 T2 T3,選A2 要出現 T1 T2 06/02 13:53
KawasumiMai: 如果數量不是很多,從一開始用json回傳整個架構是 06/02 13:57
KawasumiMai: 可能的,也比較快。js執行後修改"本頁"的php變數印象 06/02 13:58
KawasumiMai: 中是可能的,但這寫法不太好。如果你純粹只是要利用 06/02 13:58
KawasumiMai: ajax去要求下一層資料,應該是點選後直接呼叫ajax利 06/02 13:59
KawasumiMai: 用傳入值去跟後端要資料,不需要修改到本頁php變數 06/02 13:59
b8211290: 網路上很多範例我測試過,第一層資料能正常抓出來,不過 06/02 14:17
b8211290: 第二層資料卻出不來,我也不知道哪個環節錯了,能求一下 06/02 14:17
b8211290: 範例嗎? 06/02 14:17
KawasumiMai: 怎樣的出不來?點選呼叫的時候要把選擇結果傳到呼叫 06/02 15:33
KawasumiMai: ajax的function去再丟給後端。 06/02 15:34
joedenkidd: 你先試看看,select取值要用id,當抓到資再用ajax後送 06/02 20:52
joedenkidd: ,你先確定第一個select值有沒有抓到 06/02 20:54
b8211290: 剛下班回家,我再試試看,謝謝各位大大解答 06/02 23:33

目前我寫這樣:
--------------------
test.php
--------------------
<form method="POST" action="factor_design_save.php"
enctype="application/x-www-form-urlencoded">
實驗批號:<br>
<select name="eid" id="eid">
<option value="0">請選擇</option>
<?php
// 取得第一層option資料
$link = mysql_connect("127.0.0.1", "root", "")or die("unable to connect
mysql". mysql_error());
mysql_select_db("experiment");
mysql_query("SET NAMES uft8");
$query = "SELECT DISTINCT Exp_id FROM team";
$result = mysql_query($query, $link);
while ( $row = mysql_fetch_assoc($result) ) {
echo '<option value="'.$row["Exp_id"].'">'.$row["Exp_id"].'</option>'."\n";
}
?>
</select><br>
組號:<br>
<select name="tid" id="tid">
<option value="0">請選擇批號</option>
<script>
$(document).ready(function(){
$('#eid').change(function(){
//更動第一層時第二層清空
$('#tid').empty().append("<option value='0'>請選擇批號</option>");
$.ajax({
type: "GET",
url: "action.php",
data: {data:$('#eid option:selected').val()},
datatype: "json",
success: function(result){
//當第一層回到預設值時,第二層回到預設位置
if(result == "0"){
$('#tid').val($('option:first').val());//pseudo selector
}
//依據第一層回傳的值去改變第二層的內容
var i=0;
while ( i < result.length ) {
$("#tid").append("<option
value='"+result[i]+"'>"+result[i]['T_id']+"</option>");
i++;
}
},
error: function(error){
alert( "error" );
}
});
});
});
</script>
</select><br>
<input type="submit">
</form>

--------------------
action.php
--------------------
<?php
//return json format
header('Content-Type: application/json;charset=utf-8');
$link = mysql_connect("127.0.0.1", "root", "")or die("unable to connect
mysql".mysql_error());
mysql_select_db("experiment");
mysql_query("SET NAMES uft8");
$Exp_id = $_GET['data'];//get ajax data 'Exp_id'
$jarray = array();//使用array儲存結果,再以json_encode一次回傳
if ( $Exp_id != 0 ) {
$query = "SELECT t_id FROM team Where exp_id=".$Exp_id;
$result = mysql_query($query, $link);
//fetch_assoc return [{},{}]
//fetch_row return[[],[]]
//fetch_object return[{},{}]
//fetch_array return [{},{}]
while ($row = mysql_fetch_assoc($result)) {
$jarray{} = $row; //這邊如果我用 [ ] 選單出不來,用 { } 內容不是我要的 (暈..
}
} else {
echo 0;
return;
}
echo json_encode($jarray);
return;
?>
※ 編輯: b8211290 (1.173.77.138), 06/03/2015 03:11:25
※ 編輯: b8211290 (1.173.77.138), 06/03/2015 03:14:02
b8211290: 麻煩各位大大幫忙看一下是哪裡出問題了,謝謝 06/03 03:15
KawasumiMai: $jarray{} = $row ? 這是while迴圈,每讀一行都取 06/03 13:48
KawasumiMai: 一次覆蓋? 應該要用array_push吧? 06/03 13:48
hwChang: 先用 alert 或 console.log 看一下 select 的值 06/19 22:01
hwChang: 同樣的,在 success 看一下 result 得到什麼 06/19 22:02

你可能也想看看

搜尋相關網站