아약스로 선택 상자 변경

Question

두 번째 선택 상자의 값을 ajax로 변경하는 선택 상자를 작성하려고했습니다.

먼저이 지역의 AREA와 도시를 선택합니다.

내가 뭘 잘못했는지 말해 줄 수 있습니까?

클라이언트 측 :

<script> 
$(function() { 

    $("#first").change(function() { 
    $("#second").load('recs.php?area_id=' + $(this).val()); 
    }); 

}); 
</script> 


<form method="post" action="tosomewhere.php"> 

    <select id="first" name="area_id"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
    </select> 

    <select id="second" name="section"> </select> 

</form> 

서버 측 :

<?PHP 

    include "db.php" 

    $areaID = $_GET['area_id']; 
    $second_option = ""; 

    $query2 = mysql_query("SELECT * FROM `cities` WHERE area_id = $areaID ORDER BY id ASC"); 
    while($index = mysql_fetch_array($query2)) 
    { 
     $id = $index['id']; 
     $name = $index['name']; 

     $second_option .= "<option value='$id'>$name</option>"; 
    } 

    echo $second_option; 

?> 

Answer 1

이 시도,

$(function() { 

    $("#first").change(function() { 
    $.get('recs.php', {area_id: $(this).val()}, function(data) { 
     $("#second").html(data); 
    }); 
    }); 

}); 

참고 : echo 후 exit을 넣어하는 것이 좋습니다.

echo $second_option; 
exit;