2012-05-16 272 views
0

我有三個下拉列表:國家,州和城市。填充下拉列表

我想基於狀態列表選擇基於在國家列表選擇填充狀態列表和填充城市名單。

下面是我嘗試這個

  1. 從國家列表,使用onchage事件中,我調用java腳本功能。

    <select name="country" id="id1" onchange="onCountryChange(this.value)"> 
    
  2. 然後我發送一個請求到服務器以獲取與國家相關聯的州的名稱。

    function onCountryChange(str){ 
        if (window.XMLHttpRequest){ 
         xmlhttp=new XMLHttpRequest(); 
        } 
        else{ 
         xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange=function(){ 
        if (xmlhttp.readyState==4 && xmlhttp.status==200){ 
          document.getElementById("statenames").innerHTML=xmlhttp.responseText; 
        } 
    } 
    xmlhttp.open("GET","./view/countrychange.php?countryname="+str,true); 
    xmlhttp.send(); 
    } 
    
  3. 我使用下面的代碼得到狀態的值。

    <?php 
    $countryname=$_GET["countryname"]; 
    $connection = pg_connect("host=localhost port=5432 dbname=STAGE2 user=postgres password=jssate"); 
    if (!$connection){ 
        echo "<H1>Error in connection to Database</H1>"; 
        echo "<H2>Please try again</H2>."; 
    } 
    else{ 
        $query1="Select distinct(state) from master_table where country='$countryname'"; 
    $result = pg_query($connection,$query1); 
    $numrows = pg_numrows($result);  
    if ($numrows>0){ 
    echo "State <select name="state" id="stateid">; 
    for ($row_index=0;$row_index<$numrows;$row_index++) 
    { 
        $state_name=pg_result($result,$row_index,0); 
        echo "<option value="$state_name\">$state_name</option>"; 
         } 
    echo "</select>"; 
    } 
    
    } 
    pg_close($connection); 
    ?> 
    

3 .Used上我的客戶端執行以下操作的代碼來顯示結果。

<div id="statenames"> 
    //Original select list placed here is replaced by the one returned by server. 
    </div> 

這對我和我的國家都是基於國家名填充。現在我該如何填充第三個列表。我選擇的顯示狀態列表的方法是否正確?因爲我無法控制我現在得到的狀態選擇列表。

+0

你可以把你的代碼好一點請,這是很難讀,因爲它是 –

+0

我試圖編輯它幾次。有些東西是不可靠的。 –

+0

JavaScript中的轉義字符是否必需?爲什麼不嘗試xmlhttp = new ActiveXObject(「Microsoft.XMLHTTP」); –

回答

0

創建3選擇國家,城市和國家在HTML頁面中選擇

  • 全國唯一的選擇元素將有選擇,州和城市將是空的。
  • 對國家的變化時發送和Ajax請求獲取狀態,並且作爲響應發送唯一的選擇要素不換他們在一個SELECT你幹得
  • 推這些選項進入狀態的選擇元素

    document.getElementById('state')。innerHTML(state_ajax_response);

然後在將要在狀態選擇改變被調用,並再次重複上述步驟爲城市選擇

希望你得到它你的HTML文件中創建功能。

只需發送選項元素作爲響應。

+0

感謝這對我有用 – user1399186