阿賈克斯選擇並自動加載數據

Question

我的形式：

<form> 
    <select id="f_name"><?php echo $fname ?></select> 
    <select id="l_name></select> 
</form> 

我的腳本：

$(document).ready(function(e){ 
    $("#f_name").change(function(){ 
    var fname = $('this').val(); 
    $.ajax({ 
     type :'POST', 
     data :{name:fname}, 
     url :"fullname.php", 
     success : function(data){ 
     $('#l_name').html(data); 
     }  
    }); 
    }); 
}); 

我fullname.php：

$db = mysqli_connect("localhost", "root", "", "test"); 
if(isset($_POST['name'])){ 
    $f_name = $_POST['name']; 
    $sql = mysqli_query($db, "SELECT last_name FROM fullname WHERE first_name = '$f_name'"); 
    $res = mysqli_fetch_array($sql); 
    echo $res; 
} 

姓氏不會出現，因爲我選擇第一個名字。表單的

Answer 1

形成是不正確的：

<form> 
    <select id="f_name"><?php echo $fname ?></select> 
    <select id="l_name></select> 
</form> 

它應該是：

<form> 
    <select id="f_name"> 
    <option><?php echo $fname ?></option> 
    </select> 
    <select id="l_name></select> 
</form> 

您的腳本應該是這樣的：

$(document).ready(function(e){ 
    $("#f_name").change(function(){ 
    var fname = $('this').val(); 
    $.ajax({ 
     type :'POST', 
     data :{name:fname}, 
     url :"fullname.php", 
     success : function(data){ 
     $('#l_name').html('<option>'+data+'</option>'); 
     } 
    }); 
    }); 
}); 

Answer 2

$(document).ready(function(e){ 
    $("#f_name").change(function(){ 
    var fname = $('this').val(); 
    $.ajax({ 
     type :'POST', 
     data :{name:fname}, 
     url :"fullname.php", 
     success : function(data){  
     for (i in data) {       
      $("#l_name").html("<option>'+data[i]+'</option>"); 
     } 
     } 
    }); 
    }); 
});