[問題] AJAX 菜鳥新手發問,關於二層式下拉選單

看板Ajax作者 (R.V. 紅青菜)時間9年前 (2015/06/02 05:21), 9年前編輯推噓1(1026)
留言27則, 6人參與, 最新討論串1/1
各位大大你們好 想請教一下,關於二層式下拉式選單,第一層選定後 要如何 利用 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

06/02 09:23, , 1F
我覺得你應該搞錯了什麼 ajax取出的資訊是在js裡面
06/02 09:23, 1F

06/02 09:23, , 2F

06/02 11:58, , 3F
一開始就把所有第二層選單的資料都撈出來建好選單
06/02 11:58, 3F

06/02 11:59, , 4F
否則使用者選好第一層還要等ajax把第二層傳回來 實在太慢
06/02 11:59, 4F

06/02 13:50, , 5F
y大 我知道值是在 js裡,我想知道有沒有辦法讓php讀取
06/02 13:50, 5F

06/02 13:50, , 6F
06/02 13:50, 6F

06/02 13:51, , 7F
k大,我一開始就全撈出來沒有問題,不過第二層選單,我
06/02 13:51, 7F

06/02 13:51, , 8F
需要隨著第一層選取的項目跟著變化
06/02 13:51, 8F

06/02 13:53, , 9F
例如 選 A1 要出現 T1 T2 T3,選A2 要出現 T1 T2
06/02 13:53, 9F

06/02 13:57, , 10F
如果數量不是很多,從一開始用json回傳整個架構是
06/02 13:57, 10F

06/02 13:58, , 11F
可能的,也比較快。js執行後修改"本頁"的php變數印象
06/02 13:58, 11F

06/02 13:58, , 12F
中是可能的,但這寫法不太好。如果你純粹只是要利用
06/02 13:58, 12F

06/02 13:59, , 13F
ajax去要求下一層資料,應該是點選後直接呼叫ajax利
06/02 13:59, 13F

06/02 13:59, , 14F
用傳入值去跟後端要資料,不需要修改到本頁php變數
06/02 13:59, 14F

06/02 14:17, , 15F
網路上很多範例我測試過,第一層資料能正常抓出來,不過
06/02 14:17, 15F

06/02 14:17, , 16F
第二層資料卻出不來,我也不知道哪個環節錯了,能求一下
06/02 14:17, 16F

06/02 14:17, , 17F
範例嗎?
06/02 14:17, 17F

06/02 15:33, , 18F
怎樣的出不來?點選呼叫的時候要把選擇結果傳到呼叫
06/02 15:33, 18F

06/02 15:34, , 19F
ajax的function去再丟給後端。
06/02 15:34, 19F

06/02 20:52, , 20F
你先試看看,select取值要用id,當抓到資再用ajax後送
06/02 20:52, 20F

06/02 20:54, , 21F
,你先確定第一個select值有沒有抓到
06/02 20:54, 21F

06/02 23:33, , 22F
剛下班回家,我再試試看,謝謝各位大大解答
06/02 23:33, 22F
目前我寫這樣: -------------------- 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

06/03 03:15, , 23F
麻煩各位大大幫忙看一下是哪裡出問題了,謝謝
06/03 03:15, 23F

06/03 13:48, , 24F
$jarray{} = $row ? 這是while迴圈,每讀一行都取
06/03 13:48, 24F

06/03 13:48, , 25F
一次覆蓋? 應該要用array_push吧?
06/03 13:48, 25F

06/19 22:01, , 26F
先用 alert 或 console.log 看一下 select 的值
06/19 22:01, 26F

06/19 22:02, , 27F
同樣的,在 success 看一下 result 得到什麼
06/19 22:02, 27F
文章代碼(AID): #1LRCpptn (Ajax)