How to use AJAX to populate state list depending on Country list?

Posted by jasondavis on Stack Overflow See other posts from Stack Overflow or by jasondavis
Published on 2009-07-26T22:18:14Z Indexed on 2010/03/26 11:23 UTC
Read the original article Hit count: 277

Filed under:
|

I have the code below that will change a state dropdown list when you change the country list.

How can I make it change the state list ONLY when country ID number 2234 and 224 are selected?

If another country is selected is should change into this text input box

<input type="text" name="othstate" value="" class="textBox">

The form

<form method="post" name="form1">
<select style="background-color: #ffffa0" name="country" onchange="getState(this.value)">
<option>Select Country</option>
<option value="223">USA</option>
<option value="224">Canada</option>
<option value="225">England</option>
<option value="226">Ireland</option>
</select>

<select style="background-color: #ffffa0" name="state">
<option>Select Country First</option>
</select>

The javascript

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

© Stack Overflow or respective owner

Related posts about AJAX

Related posts about dropdownlist