0

インドの州と都市のリストを含むフォームがあります。州の 1 つを選択すると、その州の都市が に表示され、<select>都市が表示されます。私はどこか (同様の Web サイト) でホストされている php スクリプトを使用していますが、それが私の目的を解決できると思います。このスクリプトは、valueStateを パラメーターとして取り、対応する都市をoptions含む を返します。<select>

スクリプトは、選択したhttp://www.indane.co.in/state.php?stateid=2196状態2196の ID/値です。

これのコンテンツを私の都市に表示する必要があります。

どうすればこれができるか教えてください。

これまで私はこれを試してきましたが、

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
function showcat(id,ss,type)
{
    var cid=id.value;
    if(type=='state')
    {
        document.getElementById("state_loading").style.visibility="visible";
        var response = httpGet("http://www.indane.co.in/state.php?stateid="+cid);
        var id=document.getElementById('bgcity');
        id.innerHTML=response;
    }
}
function httpGet(theUrl)
    {
    var xHRObject = new XMLHttpRequest();
var url = theUrl;
xHRObject.open("GET", url, true);
xHRObject.send();
xHRObject.onreadystatechange = function () {
if (xHRObject.readyState==4 && xHRObject.status==200) {
    var response = xHRObject.responseText;             
      return response;
    }
}
    }
</script>
</head>

<body>
<select name="bgstate" id="bgstate" style="width:200px" onChange="showcat(this,'sub1','state');">
                  <option value="">[ SELECT STATE ]</option>
                                          <option value="2169" >Andhra Pradesh</option>
                                          <option value="2196" >Arunachal Pradesh</option>
                                          <option value="2170" >Assam</option>
                                          <option value="2171" >Bihar</option>
                                          <option value="5267" >Chhattisgarh</option>
                                          <option value="2174" >Delhi</option>
                                          <option value="2199" >Goa</option>
                                          <option value="2175" >Gujarat</option>
                                          <option value="2176" >Haryana</option>
                                          <option value="2177" >Himachal Pradesh</option>
                                          <option value="2178" >Jammu and Kashmir</option>
                                          <option value="5268" >Jharkhand</option>
                                          <option value="2185" >Karnataka</option>
                                          <option value="2179" >Kerala</option>
                                          <option value="2181" >Madhya Pradesh</option>
                                          <option value="2182" >Maharashtra</option>
                                          <option value="2183" >Manipur</option>
                                          <option value="2184" >Meghalaya</option>
                                          <option value="2197" >Mizoram</option>
                                          <option value="2186" >Nagaland</option>
                                          <option value="2187" >Orissa</option>
                                          <option value="2189" >Punjab</option>
                                          <option value="2190" >Rajasthan</option>
                                          <option value="2195" >Sikkim</option>
                                          <option value="2191" >Tamil Nadu</option>
                                          <option value="2192" >Tripura</option>
                                          <option value="5269" >UNION TERRITORY</option>
                                          <option value="2193" >Uttar Pradesh</option>
                                          <option value="5259" >Uttaranchal</option>
                                          <option value="2194" >West Bengal</option>

                    </select>           
                    <span id="state_loading" style="visibility:hidden;"><img src="http://www.indane.co.in/images/ajax_small_load.gif" /></span>     
                </td>
            </tr>

            <br/>
            <tr valign="top">
              <td>&nbsp;</td>
              <td height="25" >City <span class="error">*</span></td>
              <td colspan="2">
              <span id="sub1">
              <select name="bgcity" style="width:200px" id="bgcity" >
                 <option value="">[SELECT CITY]</option>
                </select>  
               </span> 
                <span id="city_loading" style="visibility:hidden;"><img src="http://www.indane.co.in/images/ajax_small_load.gif" /></span>          
                <input type="button" value="Search"  onClick="showcat(document.getElementById('bgcity'),'sub2','city');" style="cursor:pointer;" />

            </tr>    
</body>
</html>
4

1 に答える 1

1

問題 1 - 問題は、都市のドロップダウンの URL が選択ボックスを返し、ページ内の選択ボックスのオプションを別の選択ボックスに置き換えていることです

もう 1 つの問題は、access-control-allow-origin ヘッダーです。

ページの都市のドロップダウンを次のように置き換えます

       <span id="bgcity">
      <select name="bgcity" style="width:200px" >
         <option value="">[SELECT CITY]</option>
        </select>  
       </span>

ショーキャットを次のように変更します

function showcat(id,ss,type)
{
   var cid=id.value;
   if(type=='state')
   {
        document.getElementById("state_loading").style.visibility="visible";
        var response = httpGet("http://www.indane.co.in/state.php?stateid="+cid);
         if(response !== undefined)
        {
           var id=document.getElementById('bgcity');
           id.innerHTML=response;
        }
    }
}

選択ボックスに関連付けられている id をスパンに削除して、ドロップダウン全体を置き換えるようにしました..この変更によりエラーが発生するため、showcat 関数の 2 番目のパラメーターを削除します...

于 2013-09-04T06:24:12.020 に答える