ASP.NET Javascript郵編查找城市和國家與Mootools，jQuery或Ajax

Question

我想寫一個Javascript郵編查找實用程序。

1）用戶將從下拉菜單中選擇一個狀態。

2）市淹死向下然後將基於該國填充所選

3）所示的文本框，然後用基於選擇狀態的相應的郵編（S）填充和郵政編碼上的ASP。 NET頁面。

問題：我得到錯誤Request（）未定義，導致應用程序在選擇狀態時不成熟。

我應該在下面的代碼中添加什麼？

<script language="javascript"> 
    var request = new Request(); 
    var url = ""; 

    function getZipCode() 
    {  
request.GetNoCache(url + "getZipCode.aspx?City=" +document.getElementById("drpCity").options[document.getElementById("drpCity").selectedIndex].value+ "&State=" +document.getElementById("drpStateSearch").options[document.getElementById("drpStateSearch").selectedIndex].value,  
function(result) 
{ 
    if (result.readyState!=ReadyState.Complete) 
     return;    
    if (result.status==HttpStatus.OK && result.responseText != "") 
    { 
     var zip = result.responseText; 
     document.getElementById("txtZip").value = zip; 
    } 
    else 
    { 
     document.getElementById("txtZip").value = "No Zip Found"; 
    } 
} 
) 
    } 



    function selectCity() 
    {  
request.GetNoCache(url + "getCities.aspx?State=" +document.getElementById("drpStateSearch").options[document.getElementById("drpStateSearch").selectedIndex].value,   

function(result) 
{ 

    if (result.readyState!=ReadyState.Complete) 
     return;    
    if (result.status==HttpStatus.OK && result.responseText != "") 
    { 
     var cities = result.responseText; 
     var city_array=cities.split(","); 
     var len = document.getElementById("drpCity").options.length; 

     for(var j=len; j>=0;j--) 
     { 
      document.getElementById("drpCity").options[j]=null; 
     } 

     var option_i = new Option("--Select--","--Select--"); 
     document.getElementById("drpCity").options[0] = option_i; 

     for(var i=1; i<=city_array.length-1;i++) 
     { 
      var option_c = new Option(city_array[i-1],city_array[i-1]); 
      document.getElementById("drpCity").options[i] = option_c; 
     } 
    } 
    else 
    { 
     var option_c = new Option("No City",""); 
     document.getElementById("drpCity").options[0] = option_c; 
    } 
} 
) 
    } 

      </script> 
    <script language="javascript" type="text/javascript"> 
    <!-- 
function __doPostBack(eventTarget, eventArgument) { 
    var theform; 
    if (window.navigator.appName.toLowerCase().indexOf("microsoft") > -1) { 
     theform = document.Form2; 
    } 
    else { 
     theform = document.forms["Form2"]; 
    } 
    theform.__EVENTTARGET.value = eventTarget.split("$").join(":"); 
    theform.__EVENTARGUMENT.value = eventArgument; 
    theform.submit(); 
} 
    // --> 
    </script> 

      City: <select id="drpStateSearch" name="drpStateSearch" 
       onchange="Javascript:selectCity();" style="width: 120px;"> 
       <option value="">---Select---</option> 
       <option value="AK">Alaska</option> 
       <option value="AL">Alabama</option> 
       <option value="AR">Arkansas</option> 
       <option value="AZ">Arizona</option> 
       <option value="CA">California</option> 
       <option value="CO">Colorado</option> 
       <option value="CT">Connecticut</option> 
       <option value="DC">District of Columbia</option> 
       <option value="DE">Delaware</option> 
       <option value="FL">Florida</option> 
       <option value="GA">Georgia</option> 
       <option value="HI">Hawaii</option> 
       <option value="IA">Iowa</option> 
       <option value="ID">Idaho</option> 
       <option value="IL">Illinois</option> 
       <option value="IN">Indiana</option> 
       <option value="KS">Kansas</option> 
       <option value="KY">Kentucky</option> 
       <option value="LA">Louisiana</option> 
       <option value="MA">Massachusetts</option> 
       <option value="MD">Maryland</option> 
       <option value="ME">Maine</option> 
       <option value="MI">Michigan</option> 
       <option value="MN">Minnesota</option> 
       <option value="MO">Missouri</option> 
       <option value="MS">Mississippi</option> 
       <option value="MT">Montana</option> 
       <option value="NC">North Carolina</option> 
       <option value="ND">North Dakota</option> 
       <option value="NE">Nebraska</option> 
       <option value="NH">New Hampshire</option> 
       <option value="NJ">New Jersey</option> 
       <option value="NM">New Mexico</option> 
       <option value="NV">Nevada</option> 
       <option value="NY">New York</option> 
       <option value="OH">Ohio</option> 
       <option value="OK">Oklahoma</option> 
       <option value="OR">Oregon</option> 
       <option value="PA">Pennsylvania</option> 
       <option value="RI">Rhode Island</option> 
       <option value="SC">South Carolina</option> 
       <option value="SD">South Dakota</option> 
       <option value="TN">Tennessee</option> 
       <option value="TX">Texas</option> 
       <option value="UT">Utah</option> 
       <option value="VA">Virginia</option> 
       <option value="VT">Vermont</option> 
       <option value="WA">Washington</option> 
       <option value="WI">Wisconsin</option> 
       <option value="WV">West Virginia</option> 
       <option value="WY">Wyoming</option> 
      </select> <br /> 
      State: <select id="drpCity" name="drpCity" onchange="javascript:getZipCode()"> 
       <option selected="">Select State to Populate</option> 
      </select> 
      <br /> 
      <table id="Table6" border="0" cellpadding="0" cellspacing="0" width="100%"> 
       <tr> 
        <td height="28" width="38%"> 
         Zipcode:</td> 
        <td height="28" width="62%"> 
         <input id="txtZip" name="txtZip" type="text" /></td> 

謝謝！

Answer 1

您使用MooTools嗎？如果是這樣，您需要確保在嘗試創建新的Request對象之前引入了mootools庫。如果不是，請求不是爲ajax請求創建的適當對象。

if(window.XMLHttpRequest){ 
    request = new XMLHttpRequest(); 
}else if(window.ActiveXObject) 
{ 
    request = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
request.open("GET", url, true); 
request.onreadystatechange = callback; 
request.send(null); 
function callback() 
{ 
    if(request.readyState == 4) 
    { 
     if(request.status == 200) 
     { 
      /* do your call back stuff here */ 
     } 
    } 
} 

注是真的基礎和一種痛苦，我會建議使用框架LIB如jQuery或MooTools的做你的服務器代碼Ajax調用。

/* ** * ** UPDATE ** * ** * ** * ** * ** * ** * */ 這裏是基本的jquery ajax請求代碼：

$.ajax({ url: "test.html", 
     context: document.body, 
     data:{"info":"I'm sending this back to the server"}, 
     success: function(data){ 
       /* do your callback stuff here */ 
     }, 
     error(jqXHR, textStatus, errorThrown){ 
       /* let's you know where you went wrong */ 
     } 
}); 

api def是here.