选择选项以根据 mysql 填充的下拉列表更新第二个选择选项

Question

我正在尝试创建一个智能表单，它会自动限制第二个下拉框的可用选项。

背景： 我正在创建一个票务系统，我希望用户从“站点选择”下拉列表中选择一个站点，然后“用户选择”下拉列表将仅包含链接到第一个下拉列表中选择的站点的用户，所有从 MySQL 填充的信息。

未来： 然后，我想在“选择受影响的服务”下使用复选框列出与该用户关联的所有服务

我的 js 很差。到目前为止，我已经能够通过在这里搜索找到一些代码，这些代码允许我将用户的计算机 ID 写入文本字段。但我无法弄清楚如何捕获输出和查询计算机名称（不同的表）并将其显示为复选框选项或使用相同的方法来限制下一批选择框。下面列出的所有代码我还没有清理，alpha 阶段。

我意识到我可以只使用 PHP 分步执行此操作，但我正在尝试在这里和那里完善我的编码。

显示下拉菜单：

    <h3>Assign Site</h3> 

    <select id="site_add" name="site_add" style="width:217px; height:20px !important;">
        <option value="-1"></option>';

  $o = "SELECT * FROM company_sites WHERE company_id = " . $company_id . " ORDER BY sitename";
$rs = mysql_query($o);
$nr = mysql_num_rows($rs);
for ($i=0; $i<$nr; $i++) {
$r = mysql_fetch_array($rs);
        echo '<option value="' . $r['id'] . '">' . $r['sitename'] . '</option>';
    }

    <h3>Assign User</h3> 
    <select id="comp_add" name="comp_add_1" style="width:217px; height:20px !important;">
        <option value=""></option>';

  $o = "SELECT * FROM company_staff WHERE company_id = " . $company_id . " ORDER BY id DESC";
$rs = mysql_query($o);
$nr = mysql_num_rows($rs);
for ($i=0; $i<$nr; $i++) {
$r = mysql_fetch_array($rs);

    $user_computer_id = $r['computer_id'];

        echo '<option value="' . $r['id'] . '">' . $r['firstname'] . ' ' . $r['lastname'] . '</option>';
    }

当前 JS 将所​​选用户的计算机 ID 输出到文本字段中：

<script type="text/javascript"> 
window.onload=function() { attachBehaviors(); }; 
// 
function attachBehaviors() { 
 document.getElementById(\'person\').onchange=function() { 
 loadUser(this.options[this.selectedIndex].value); // <-- check this, may be incorrect 
 } 
} 
function loadUser(optionvalue) { 
 // Always set a default 
 if (optionvalue==\'\') {  
 return; 
 }
 opts = optionvalue.split(\':\'); 
 var name = opts[0]; 
 var email = opts[1]; 
 document.getElementById(\'computer_id\').value=name; 
} 

</script> 

<select name="person" id="person"> 
    <option value=""></option>';


$result=mysql_query("SELECT * FROM company_staff"); 
while($row=mysql_fetch_array($result)) { 

$submit_firstname = $row['firstname']; 
$submit_lastname = $row['lastname']; 
$submit_staff_id = $row['id']; 
$submit_computer_id = $row['computer_id']; 


 echo '<option value="' . $submit_staff_id . '">' . $submit_firstname . ' ' . $submit_lastname . '</option>\n'; 
} 
echo '
</select> 
<input type="text" id="computer_id" name="name" placeholder="name" /> 
';

任何关于如何实现这一目标的建议将不胜感激！

提前致谢！

Answer 1

您需要 AJAX，它是 PHP 和 JS 的组合。 （javascript从服务器请求数据，php处理请求，返回数据）。

您需要稍微练习一下 AJAX 才能了解如何制作此选择框。

这是理论上的过程：

1. 您使用 PHP 输出您的第一个选择框。

2. 为其创建一个 onchange 事件处理程序，该处理程序将调用服务器以获取信息。

   ..选项..

3. 此 updateNewDropDown 函数将从您选择的服务器响应中获取值，并通过 PHP 为第二个选择菜单获取新数据，并使用提供的数据 AJAX 响应创建新选择菜单。

AJAX 教程：

http://api.jquery.com/jQuery.ajax/ http://www.w3schools.com/ajax/default.asp