如何根据下拉选择填充文本框?

Question

我必须根据单个表中的下拉值填充我的文本框...... 这是我的表格： 表结构 表内容

在这里，当我从下拉列表中选择类别 1 时，我希望文本框值为 400(价格(，对于类别 2，它应该填充 500，依此类推。我已经从数据库填充了下拉值，请帮助我处理文本框值。

控制器：

public function viewcatprice()
{
$this->load->model('JcMeetingExpense_model');
$data['query1'] = $this->JcMeetingExpense_model->viewcatprice();   
$this->load- 
>view('JcMeetingExpense/jc_meeting_expense',$data);
}

型：

function viewcatprice()
{
$query = $this->db->select('*')->from('jc_price_master')->get();
return $query->result();
}

视图：

<label for="catprice"></label>
<select class="form-control" name="category">
<?php   
foreach($query1 as $row)
{ 
echo '<option value="'.$row->category.'">'.$row- 
>category.'</option>';
}
?>
</select>
<tr>
<td class="colone">Amount Per Head:</td>
<td class="coltwo"></td>
<td class="colthree"><input type="number" name="num5"  id="num5" 
class="input-field" name="field1" style="width:35%;" />
</td>
</tr>

Answer 1

请参考下拉菜单中的jQuery更改事件

或者如果你不想使用 jQuery，请使用 HTML 标签的 "onchange" 属性并在 JS 中处理它

Answer 2

查看代码

<select class="form-control" name="category" id='cat_id'>
<?php   
foreach($query1 as $row)
{ 
echo '<option value="'.$row->category.'">'.$row- 
>category.'</option>';
}
?>
</select>
jQuery(document).ready(function($) {
$("#cat_id").on('change', function() {
var cat_id = $(this).val();
if(cat_id){
$.ajax ({
type: 'POST',
url: 'php_file_that_select_price_from_category_id.php',
data: { cat_id: cat_id },
success : function(response) {
var response = $.parseJSON(response);
$('#num5').val(response.jc_price_master); 
},error:function(e){
alert("error");}
});
}
});
});

ajax 的控制器代码

public function ajax_price_list() 
{ 
$this->load->helper('url'); 
$this->load->model('JcMeetingExpense_model'); 
$data['jc_price_master'] = $this->JcMeetingExpense_model->getprice(); 
//$this->load->view('JcMeetingExpense/jc_meeting_expense',$data); you do not have to load view here
echo jason_encode($data);
}