2009-11-01 254 views
1

我有一個2下拉列表並排。當用戶從第一個列表中選擇時,我需要顯示第二個列表的選項。下拉列表選項填充第二個列表js/php?

子選項將從數據庫中檢索。我有一個頁面,將返回給定的父母的必要的HTML。我只需要第一個列表的選擇來觸發列表#2的更新。

完成此操作的最佳方法是什麼?

<select id="parent" name="list1"> 
    <option value="1">Parent 1</option> 
    <option value="2">Parent 2</option> 
    <option value="3">Parent 3</option> 
    <option value="4">Parent 4</option> 
</select> 

<select id="child" name="list2"> 
</select> 

警告:無法使用表格,導致選擇是另一種形式的一部分。

+0

@Patrick - 你可以使用jQuery嗎?我注意到你今天在這裏問了其他的jQuery問題。 – karim79 2009-11-01 11:33:26

+0

請您澄清一下爲什麼選擇不同的事實會阻止您提交第一個表單並根據第一個表單的選定項生成其他表單? – quosoo 2009-11-01 11:34:22

+0

我的印象是,你不能在表格中填寫表格,因爲它會導致選擇提交哪一種表格。 – mrpatg 2009-11-01 11:38:29

回答

1

正常的方式做,這是做一個AJAX請求的第一個下拉列表中選擇要檢索第二內容後。

你到底如何做到這一點,將取決於你使用的框架/庫,但這裏有一個jQuery插件爲它設計的一個例子:

jQuery cascade plugin

還有一些相關的問題上SO,可以幫助:

https://stackoverflow.com/search?q=cascading+dropdown

+0

感謝您澄清這一點,這將有助於我的搜索努力! – mrpatg 2009-11-01 11:37:52

1

使用事件的onchange選擇來調用一個Ajax函數來獲取新的數據

0

一個死簡單的方法就是你的腳本設置爲輸出生成的選擇列表中的所有標記,並注入到這一點的包裝元素,例如:

<div id="wrapper"> 
    <select id="child" name="list2"> 
    </select> 
</div> 

$("#parent').change(function() { 
    $('#wrapper').load('getSelect.php','selection=' + $(this).val()); 
    return false; // may or may not be needed 
}); 
相關問題