AJAX预填充下拉菜单

Question

这是一个有点复杂，所以忍耐一下：

在form.php的，我有2个下拉菜单：

Plant type下拉，允许用户选择“植物类型“。

Plant sub-type下拉是通过AJAX和数据库的调用提出了“植物分型的多元选择。

AJAX代码：

<script type="text/javascript"> 
    function getXMLHTTP() { 
     var xmlhttp = false; 
     try { 
      xmlhttp = new XMLHttpRequest(); 
     } 
     catch (e) { 
      try { 
       xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
      catch (e) { 
       try { 
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
       } 
       catch (e1) { 
        xmlhttp = false; 
       } 
      } 
     } 
     return xmlhttp; 
    } 

    function getPlantSubtype(strURL) { 
     var req = getXMLHTTP(); 
     if (req) { 
      req.onreadystatechange = function() { 
       if (req.readyState == 4) { 
        if (req.status == 200) { 
         document.getElementById('plant_subtype_div').innerHTML = req.responseText; 
        } else { 
         alert("There was a problem while using XMLHTTP:\n" + req.statusText); 
        } 
       } 
      } 
      req.open("GET", strURL, true); 
      req.send(null); 
     } 
    } 
</script> 

完美的作品，当我提出，值将保存在数据库和表格下面的表格所示。

现在用户想要编辑该条目，单击带有info的表格单元格旁边的'Edit'。

值“设备类型”和“植物子类型”通过$_POST传递给EDIT.php。 （使用Smarty的标签）

EDIT.php代码：

<select name="plant_type" onchange="getPlantSubtype('plant_subtype.php?plant_type='+this.value)"> 
    <option selected="selected" value="{$plant_type}"> 
     {$plant_type} 
    </option> 

    <option value="" disabled="disabled"> 
     --- 
    </option> 

    <option value="1"> 
     Tomato 
    </option> 

    <option value="2"> 
     Carrot 
    </option> 
</select> 

<div id="plant_subtype_div"> 
    <select name="plant_subtype"> 
     <option selected="selected" value="{$plant_subtype}"> 
      {$plant_subtype} 
     </option> 

     <option value="" disabled="disabled"> 
      --- 
     </option> 
    </select> 
</div> 

在EDIT.php两个下拉菜单显示正确的值。

但是当我点击Plant sub-type下拉多选项不可用。

这是因为表单已经预先填入$_POST而onChange尚未发生。

如何使Plant sub-type下拉显示其选择加载EDIT.php什么时候？

Answer 1

一个选项是只在页面加载时调用getPlantSubtype('plant_subtype.php?plant_type={$plant_type}')。

例如（在页面的底部）：

<script type="text/javascript"> 
    getPlantSubtype('plant_subtype.php?plant_type={$plant_type}') 
</script> 

一个更好的选择将是来自同一个地方plant_subtype.php获取他们（高速缓存，DB）和填充选项值取亚型。