在HTML頁面加載之前執行Javascript來填充下拉菜單

Question

我有2個HTML格式的下拉菜單。 需要使用數據庫中存在的用戶名列表填充第一個下拉列表。

其次，根據第一個下拉列表中的選擇，然后我需要運行另一個JS腳本來再次調用數據庫，以檢索與該用戶名關聯的地址列表。

您能告訴我實現此目標的最佳方法是什么嗎？ 1）如何在HTML表單加載之前運行JSscript以返回該列表？ 2）我應該在一個Db調用中同時獲取用戶名和相關地址，還是先獲取用戶名，然后在第一個下拉列表中使用onChange事件執行第二個調用？

任何代碼將不勝感激。

謝謝

Answer 1

好吧，如果您將所有信息都放在同一個表中，那為什么不通過查詢數據庫一次就獲得所有數據，然后按照所需的方式對數據進行排序和放入元素中。 另一種方法將需要查詢數據庫2次。

Answer 2

here you can create your HTML to server call OR you can make HTML locally.
i have created options for selectbox at server and innerhtml to locally.

<select id="selectbox1" onchange="getData(this)"></select>
<select id="selectbox1"></select>

$(document).ready(function() {

$.ajax({
  url: 'http://localhost/getUsername.php',
  success: function(data) {
    $('#selectbox1').html(data);
    alert('Load was performed.');
  }
});

});

function getData(selData) {

$.ajax({
  url: 'http://localhost/getSecoundCall.php?id='+selData,
  success: function(data) {
    $('#selectbox2').html(data);
    alert('Load was performed.');
  }
});

}