Question

HTML code :

<form>
  <tr><td align="center">
    <p><select size="1" id="breed_list" name="D1" onChange="editBreed(this.value);"> 
      <option>Select Cattle Breed</option>
      <?php while(list($id, $breed)=mysql_fetch_row($result1)) {
        echo "
        <option value=\"".$id."\">".$breed."</option>";
      } ?>
      </select></p>
    </td></tr>
</form>

Javascript code :

<script type="text/javascript">
function editBreed(str){
    alert("Made it to Edit Breed"+ str);
    if (str=="" || str=="Select Cattle Breed") {
        document.getElementById("animal_data").innerHTML="";
        return;
    }

    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.readyState==4 && xmlhttp.status==200) {
            document.getElementById("animal_data").innerHTML=xmlhttp.responseText;
        }
    }

    xmlhttp.open("GET","editbreed.php?d="+str+,true);
    xmlhttp.send();
}
</script>

If I modify the select to read onChange="alert(this.value);">, it displays the correct record, for some reason though it’s not going to the function and showing me the alert that’s there.

Thanks

Answer 1

On the second to last line in your function, there is a syntax error that is causing the function not to run at all.

xmlhttp.open("GET","editbreed.php?d="+str+,true);

remove the + after str

xmlhttp.open("GET","editbreed.php?d="+str,true);