Yii2中如何在GridView内创建下拉框并通过AJAX获取选中值

问题根源梳理 #

1. 下拉框ID重复：GridView每行渲染时都会生成id='Almacen'的下拉框，DOM要求ID唯一，导致无法精准定位当前行的下拉框。
2. 默认值未关联模型：原代码中下拉框的默认选中值写死为'name'，未绑定当前模型的warehouse字段值。
3. AJAX逻辑错误：
   • 使用.html()获取的是下拉框的HTML代码，而非选中值，应改用.val()
   • 变量名混淆：将order赋值给未定义的warehouse变量
   • 元素选择器无效：.warehouse无法定位到下拉框，需调整选择策略

修正后的GridView代码 #

[
    'attribute' => 'warehouse',
    'label' => Yii::t('wms', 'Almacen'),
    'vAlign' => 'middle',
    'value' => function ($model) {
        // 生成唯一ID（结合模型主键），避免DOM冲突
        $dropdownId = 'Almacen-' . $model->id;
        // 绑定模型当前的warehouse值作为默认选中项
        return Html::dropDownList(
            'warehouse[' . $model->id . ']', 
            $model->warehouse, 
            ['1' => 'Sym 1', '2' => 'Sym 2'], 
            ['id' => $dropdownId, 'class' => 'form-control warehouse-select']
        );
    },
    'format' => 'raw'
], 

• 给每个下拉框添加统一类名warehouse-select，方便批量选择
• name字段采用warehouse[模型ID]格式，后端可直接解析为数组处理批量数据

修正后的AJAX代码 #

$(keys).each(function(i, key) {
    // 定位当前行的下拉框，获取选中值
    var warehouseVal = $('tr[data-key=' + key + ']').find('.warehouse-select').val();
    units.push({
        key: key,
        order: warehouseVal,
        value: $('#pa-'+key).val()
    })
}); 

• 通过tr[data-key]精准定位当前行，再结合类名找到对应下拉框
• 用.val()直接获取选中的选项值

额外注意事项 #

• 固定选项无需依赖数据库，只要保证每个下拉框可唯一定位即可正常回传数据
• 调试时可添加console.log(warehouseVal)，检查是否正确获取到选中值
• 后端接收批量数据时，可直接通过Yii::$app->request->post('warehouse')拿到所有行的选中值数组

内容的提问来源于stack exchange，提问作者Zargathronax