2011-02-13 174 views
0

這是一個有點複雜,所以忍耐一下:AJAX預填充下拉菜單

在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下拉多選項不可用。

這是因爲表單已經預先填入$_POSTonChange尚未發生。

如何使Plant sub-type下拉顯示其選擇加載EDIT.php什麼時候?

回答

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)和填充選項值取亞型。

+0

混戰師 - 不幸的是,沒有工作 - 我認爲這個問題是您發送的代碼仍然掛`onChange` - 我們怎麼把它弄出來的存在,並且鏈接到頁面加載? – pepe 2011-02-13 16:33:46