如何使用基于选择标记的AJAX从数据库中检索数据?

Question

假设我们有两个选择标签

<select id='combobox_1'>
<option value='1'>Description of fist record</option>
<option value='2'>Description of second record</option>
</select>
<select id='combobox_2'></select>

数据库上有两个表

table_1

combox_1_db_id PK

combox_1_db_description

table_2

combox_2_db_id PK

combox_1_db_id FK

combox_2_db_description

现在我想向 PHP 发送一个 AJAX 请求，其中包含在 combobox_1 中选择的选项的值，以填充数据库中的记录，combobox_2基于combobox_1_id。

.JS

$('#combobox_1').on('change', function() {
var option_value = $('#combobox_1').find('option:selected').val();
$.ajax({
url: '/get_records',
method: 'GET',
dataType: 'JSON',
success: function(data) {   
$(data).each(function() {
var option = $('<option />');
option.attr('value', 
this.combox_2_id).text(this.combox_2_description); 
$('#combobox_2').append(option);
});
},
error: function() {
console.log('Error on loading records');
}
});
});

.PHP

$this->router->get_request('/get_records', function() {
$records= $this->soap_server->getRecords(array(
'combox1Id' => $_GET['combox_1_id']
));
echo json_encode($records->return);
});

但是我没有找到将 id 发送到 PHP 的方法，因此我可以根据该 id 获取记录并将它们加载到combobox_2中，任何帮助将不胜感激。

Answer 1

您可以在 ajax 中发送option_value，只需将其作为数据包含在内即可...

$('#combobox_1').on('change', function() {
// get the id of the selected option
var id = $(this).children(":selected").attr("id");
$.ajax({
url: '/get_records',
method: 'GET',
dataType: 'JSON',
data: {combox_1_id: id},  // send the id in the request
success: function(data) {   
$(data).each(function() {
var option = $('<option />');
option.attr('value', 
this.combox_2_id).text(this.combox_2_description); 
$('#combobox_2').append(option);
});
},
error: function() {
console.log('Error on loading records');
}
});
});