使用ajax输入产品代码后更改下拉列表

Question

我已经在数据库中存储了产品。我想在用户输入产品代码时立即向服务器发送一个ajax请求，并且与该产品代码相关的尺寸将为我获取并在下拉列表中显示。

我已经为此编写了以下代码，请求被正确地发送到服务器并为我取了大小。

我的问题是Responso没有出现在下拉列表中为我

html代码

<div class="form-group  col-md-2">
<label>productCode</label>
<input type="text"  class="form-control" id="productCode">
</div>
<div class="form-group  col-md-2">
<label>productSize</label>
<select  id="productSize" class="form-control">

</select>
</div>

ajax代码

$('#productCode').keyup(function () {
var productId = this.value;
$.ajax({
method:'post',
url:'<?= baseUrl() ?>/panel/getSizeProduct',
data:{
'productId':productId
},
success:function(msg) {
$('#productSize').html(msg);
}
})
});

我的控制器

public function getSizeProduct()
{
$productId = post('productId');
$records = PanelModel::getSizeByProductId($productId);
foreach($records as $record) {
echo '  <option value='.$record['productSize'].'>'.$record['productSize'].'</option>';
}
}

我的模型

public static function getSizeByProductId($productCode)
{
$db = Db::getInstance();
$records = $db->query("SELECT productSize FROM s_product WHERE productCode=:productCode", array(
'productCode' => $productCode,
));
return $records;
}

更新当检查元素时，值被正确放置，但ui部分没有显示任何内容

Answer 1

我能解决我的问题，我将留下我的方法来解决这个问题，也许会对其他朋友有所帮助

$('#productSize').selectpicker('refresh');