Problem updating select tag with ajax on IE

I have a problem with inner html funcion when updating tag options. In the first select tag I am chosing a country and ajax code must update cities in the other select tag. My code works in all major browsers except IE. Here is the js code for calling php script:

>function show_zones(str)
>{
>if (window.XMLHttpRequest)
>  {// code for IE7+, Firefox, Chrome, Opera, Safari
>  xmlhttp=new XMLHttpRequest();
>  }
>else
>  {// code for IE6, IE5
>  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
>  }
>xmlhttp.onreadystatechange=function()
>  {
>  if (xmlhttp.readySta开发者_运维百科te==4 && xmlhttp.status==200)
>    {
>    document.getElementById('region_to').innerHTML="";
>   jQuery.noConflict();
>   (function($) {
>   $('#region_to').append(xmlhttp.responseText);
>   })(jQuery);
>   alert(xmlhttp.responseText);
>   }
>  }
>xmlhttp.open("GET","ajax/zones.php?country="+str,true);
>xmlhttp.send();
>}

In all browsers alerted code returns appropriate option tags but in IE it returns "Undifined". I am using Jquery to append xmlhttp.responseText because IE does not support innerhtml for select tags. noConflict function is used to avoid conflict between mootolls and jquery libraries. I can`t just place select tag in a div and print it instead of printing just options because I am using custom select which is being created by js code when the window.onload event occurs.

here is the php code:

>require_once("../../connect.php");
>$country_query="SELECT* FROM `tour_countries` WHERE  >country_name='".$_GET['country']."'";
>$country_result=mysql_query($country_query);
>$country_row=mysql_fetch_array($country_result);
>$zone_query="SELECT* FROM `tour_zones` WHERE country_ID='".$country_row[0]."'";
>$zone_result=mysql_query($zone_query);
>while($zone_row=mysql_fetch_array($zone_result))
>{
>   echo '<option value="'.$zone_row[1].'">'.$zone_row[1].'</option>';
>}

Thanks for replys and sorry for my poor englesh.

---

I had the same issue with IE and .innerHtml() with ajax calls. I solved it by making the AJAX a POST request and using jQuery .html() instead of .innerHTML(), for some reason IE is pretty glitchy with innerHtml(). Here's the working function I used:

function getCitiesFromState(state, select, spinnerNum)
{
    if (window.XMLHttpRequest)
    {
        xmlhttp = new XMLHttpRequest();
    }
    else
    {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    var ran = Math.round((new Date()).getTime() / 1000),
    terms = "state="+state+'&r='+ran;

    xmlhttp.open("POST","ajax5.php",true);
    xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

    /***********************************************************
    * These two lines cause Chrome to throw non-fatal errors.
    * Removing them didn't change the functionality of the
    * request, but this may end up needing a conditional.
    ***********************************************************/
    //xmlhttp.setRequestHeader('Content-length', terms.length);
    //xmlhttp.setRequestHeader('Connection', 'close');

    xmlhttp.onreadystatechange = function()
    {
        $('#spinner'+spinnerNum).fadeIn(300);

        if (xmlhttp.readyState  == 4 
         && xmlhttp.status      == 200)
        {
            $('#spinner'+spinnerNum).fadeOut(100);
            $('#'+select).html(xmlhttp.responseText);
        }
    }

    xmlhttp.send(terms);
}

And the ajax5.php file:

<?php
    include 'db.class2.php';
    $DB = new DB_MySql2;
    $DB->connect();

    $state = mysql_real_escape_string($_POST['state']);

    $q = $DB->query("SELECT DISTINCT `city`, `zip_code`
                     FROM `usa_master` 
                     WHERE `state` = '".$state."' 
                     GROUP BY `city`
                     ORDER BY `population` DESC LIMIT 0, 150");

    while($r = $DB->fetch_assoc($q)) {
        $city[] = $r['city'];
        $zips[] = $r['zip_code'];
    }

    array_multisort($city, $zips);

    echo '<option value="" selected="selected">Select City</option>';
    $size = sizeof($city);

    for ($x = 0; $x < $size; $x++)
    {
        if (strlen($zips[$x]) == 4)
        {
            $zips[$x] = '0' . $zips[$x];
        }

        echo '<option class="city_list" value="'.$zips[$x].'">'.$city[$x].'</option>';
    }
?>

Hope this helps.