Issue With the Ajax's derived Selection box

Question

<script type="text/javascript" src="jquery-1.js"></script>
<style type="text/css">
div {
    height:25px;
}
label {
    text-align:left;
    width:100px;
    display:inline-block;
    vertical-align:top;
}
input {
    margin-right:5px;
}
</style>
<script type="text/javascript">
    //<![CDATA[ 
    $(window).load(function(){
     // $('select').toggle();   
    $('input').click(function(event) {
        $(this).closest('div').children('select').toggle();
    });
    });
    //]]> 
</script>

<?php 

    @mysql_select_db('badoo',mysql_connect('localhost', 'root', ''));   



    $query = "select id,language,code from language  WHERE first=1";
    $results = mysql_query( $query);
    $lang = array();

    while ($rows = mysql_fetch_assoc(@$results)){
        $lang[$rows['language']] = $rows['code'];
    }

?>

<form action="" method="post" name="myForm" id="myForm" >
  <?php     
    foreach($lang as $key=>$value){ ?>
  <div>
    <label for="lang_<?=$value;?>" >
      <input name="language[<?=$value;?>]" id="lang_<?=$value;?>" value="1" type="checkbox">
      <?=$key;?>
    </label>
    <select style="display: none;" name="level[<?=$value;?>]" id="f_level_<?=$value;?>">
      <option selected="selected" value="">your level</option>
      <option value="Low">Low</option>
      <option value="Average">Average</option>
      <option value="Fluent">Fluent</option>
      <option value="Native">Native</option>
    </select>
  </div>
  <?php } ?>

  <input value="submit" name="submit" type="submit">

<!--**********************************************************-->

<br />
<br />
<br />
  <script type="text/javascript">
function showCD(str)
{
    if (str == "") {
        document.getElementById("txtHint").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("newone").innerHTML=xmlhttp.responseText;
            $('#newone').append(xmlhttp.responseText);
            //          document.getElementById('newone').appendChild(xmlhttp.responseText);
        }
    }

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

<?php 

    @mysql_select_db('badoo',mysql_connect('localhost', 'root', ''));   



    $query = "select id,language,code from language WHERE first=0";
    $results = mysql_query( $query);
    $lang = array();

    while ($rows = mysql_fetch_assoc(@$results)){
        $lang[$rows['language']] = $rows['code'];
    }

?>


<select  name="level[]" id="f_level" onchange="showCD(this.value)">
      <option selected="selected" value="">language</option>      
<?php     
    $results = mysql_query( $query);


    while ($rows = mysql_fetch_assoc(@$results)){
    ?>
        <option value="<?php echo $rows['id'];?>" ><?php echo $rows['language'];?></option>
<?php    
    }
    ?>
</select>

<div id="newone"></div>
</form>
---------------
<?php

    mysql_select_db('badoo',mysql_connect('localhost', 'root', ''));    

if($_REQUEST)
{
    $id     = $_REQUEST['q'];
    $query = "select id,language,code from language where id = ".$id;
    $results = mysql_query( $query); 
    $rows = mysql_fetch_assoc($results );

    if($rows!='')
    {?>
        <div>
        <label for="lang_<?=$rows['code'];?>" >
          <input name="language[<?=$rows['code'];?>]" id="lang_<?=$rows['code'];?>" value="1" type="checkbox">
          <?=$rows['language'];?>
        </label>
        <select style="display: none;" name="level[<?=$rows['code'];?>]" id="f_level_<?=$rows['code'];?>">
          <option selected="selected" value="">your level</option>
          <option value="Low">Low</option>
          <option value="Average">Average</option>
          <option value="Fluent">Fluent</option>
          <option value="Native">Native</option>
        </select>
        </div>
    <?php
    }
    return;
}
?>

Answer 1

Unfortunately I can't yet comment everywhere so apologies for adding an answer when a comment would have sufficed.

2 suggestions for you: 1) You are using jQuery but not making use of its excellent AJAX functions. Take a look at them. 2) You are suppressing PHP warnings and errors that may be helpful to you debugging this yourself. Remove the @ from the front of several of these function calls and run it again. Maybe you will see the problem yourself.

The only other thing that jumped out at me while scanning this code (since I have no idea what your problem is) is that the derived responce does not include the 'onchange' event that all of your other selects do. Is it a simple oversight?