How to fill drop down value using ajax in codeigniter?

[eluser]tariq123[/eluser]
Hi,
I want to implement country,state dropdown list in my application.I have used traditional ajax but it respond me your xmlhttp request not found.Please help me. where i place php file through which i get response.

currently my Ajax file is in root.

[eluser]Berserk[/eluser]
jQuery code:

Code:

get_country = function(){
requestUrl = BASE_URL+ '/get_country';
jQuery.get(requestUrl,{'param':param},function(result){
var txt ='';
jQuery.each(result,function(i,item){
     txt += '<option value="'+item.country_code+'">'+item.country_name+'</option>';  
});
jQuery('#display_country').html(txt);

},'json');
}

In your controller:

Code:

function get_country(){
  $countries = $this->model->get();
  $arr = array(
   key => value,
   );
  echo json_encode($arr);

}

That's it

[eluser]tariq123[/eluser]
thanks a lot. I have another script which is working fine but when i post data state value is empty.I have implement this code in this way.First i include javascript in my head section.

[removed]

function getXMLHTTP() { //fuction to return the xml http object
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 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')[removed]=req.responseText;
} else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}
function getCity(countryId,stateId) {
var strURL="findCity.php?country="+countryId+"&state;="+stateId;
var req = getXMLHTTP();

if (req) {

req.onreadystatechange = function() {
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
document.getElementById('citydiv')[removed]=req.responseText;
} else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}

}
[removed]

then in view file i write this code

<tr>
<td bgcolor="#f3f3f3">Country:</td>
<td bgcolor="#f3f3f3">
<select name="rest_country">
<option value="">Select Country</option>
<option value="1">USA</option>
<option value="2">Canada</option>
</select> </td>
</tr>
<tr>
<td>State:</td>
<td><select name="state">
<option>Select Country First</option>
</select></td>
</tr>

This is file from which i get respone

$query="SELECT id,statename FROM state WHERE countryid='$country'";
$result=mysql_query($query);

?&gt;
<select name="rest_state">
<option>Select State</option>
&lt;? while($row=mysql_fetch_array($result)) { ?&gt;
<option value=&lt;?=$row['id']?&gt;>&lt;?=$row['statename']?&gt;</option>
&lt;? } ?&gt;
</select>


My ajax request works fine but when i post my data.My state drop down field show empty data.

Please help me to sort out my problem or is there any other solution.