当用户在yii2中从下拉列表中选择名称时，如何在另一个表单字段中获取和显示用户名？

Question

当用户在上面的下拉列表中选择讲师名称时，我希望在另一个文本输入字段表单中显示讲师用户名。

​

这是我下拉列表讲师名的代码。

<?= $form->field($model, 'LecturerName')->dropDownList(
        ArrayHelper::map(User::findAll(['category' => 'lecturer']),'fullname','fullname'),
        ['prompt'=>'Select Lecturer']
        ) ?>

这是我的讲师用户名代码

<?= $form->field($model, 'LecUsername')->textInput(['maxlength' => true]); ?>

我想得到并显示基于上面选择的下拉列表的LecUsername。LecUsername来自数据库。

Answer 1

在使用下拉列表时，需要为下拉列表绑定change事件，以便将下拉列表中的值插入到输入文本中。为了确保您正在为LecUsername插入LecturerName，您需要将LecUsername作为下拉列表的值，这意味着下拉数据应该以username字段作为索引，目前您正在使用fullname作为索引和值，因此根据用户名的字段名更改代码，我假设示例是username。

ArrayHelper::map(User::findAll(['category' => 'lecturer']),'username','fullname')

所以你的下拉代码看起来就像

<?= $form->field($model, 'LecturerName')->dropDownList(
        ArrayHelper::map(User::findAll(['category' => 'lecturer']),'username','fullname'),
        ['prompt'=>'Select Lecturer']
        ) ?>

然后在有表单的视图文件的顶部添加下面的内容

$ddId=Html::getInputId($model, 'LecturerName');
$inputId=Html::getInputId($model, 'LecUsername');

$js = <<< JS
$(document).ready(function(){
    $("#{$ddId}").on('change',function(e){
        $("#{$inputId}").val($(this).val());
    });
});
JS;
 $this->registerJs($js, \yii\web\View::POS_READY);

一个更好的下拉列表方法是使用库卡蒂克-v\select2 2并使用event pluginEvents选项来指定事件select2:select，在这种情况下，您的代码应该如下所示。

// Usage with ActiveForm and model
echo $form->field($model, 'LecturerName')->widget(Select2::classname(), [
    'data' => ArrayHelper::map(User::findAll(['category' => 'lecturer']),'username','fullname'),
    'options' => ['placeholder' => 'Select Lecturer'],
    'pluginOptions' => [
        'allowClear' => true
    ],
    'pluginEvents'=>[
        "select2:select" => 'function() { $("#{$ddId}").on('change',function(e){
             $("#{$inputId}").val($(this).val());
         }); }',
    ]
]);