Question

请问Yii2有问题：我想根据下拉列表中所选选项的更改将值插入textInput字段。这是我的代码：

<?= $form->field($model,   'course_taken')->dropDownList(ArrayHelper::map(Courses::find()->all(),'course_code','course_code')) ?>

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

因此，当用户从下拉列表中选择课程时，textInput将显示所选行的课程详细信息。 course_taken和course_details都是同一数据库表中的列。提前致谢。

Answer 1

你可以借助JavaScript来实现。

1）为AJAX请求创建操作，以便在控制器中通过id获取课程详细信息，并将响应格式设置为JSON。我更喜欢使用How to use template inheritance with Chameleon?而不是在渲染之前设置它：

use yii\web\Response;

...

Yii::$app->request->format = Response::Format_JSON;

但你也可以使用这种方法作为替代方案。

use yii\web\Response;

...

/**
 * @inheritdoc
 */
public function behaviors()
{
    return [
        [
            'class' => ContentNegotiator::className(),
            'only' => ['get-course-details'],
            'formats' => [
                'application/json' => Response::FORMAT_JSON,
            ],
        ],
    ];
}

/**
 * @param $id
 * @return array
 * @throws NotFoundHttpException
 */
public function actionGetCourseDetails($id)
{
    $model = $this->findModel($id);

    return ['courseDetails' => $model->course_details];
}

/**
 * @param integer $id
 * @return YourModel
 * @throws NotFoundHttpException
 */
protected function findModel($id)
{
    if (($model = YourModel::findOne($id)) !== null) {
        return $model;
    } else {
        throw new NotFoundHttpException('This course does not exist.');
    }
}

添加一些JavaScript：

$('#select-id').change(function() {
    $.get('get-course-details', function(data) {
        $('#text-input-id').text(data.courseDetails);
    }).fail(function() {
        alert('Failed to get course details');
    });
});

要了解有关如何在Yii2中组织JavaScript工作的更多信息，请参阅官方文档中的ContentNegotiator部分。

当然你可以通过添加加载微调器或类似的东西来改善这一点，但这只是一个基本的例子。

2）如果课程详情的数量很少而且文字也很小，你可以急切地将它包含在某个地方的DOM中，例如选项（"data-course-details" = ...）的数据属性和然后得到它：

$('#select-id').change(function() {
    var courseDetails = $(this).find(":selected").data('course-details');
    $('#text-input-id').text(courseDetails);        
});

3） 2）的类似方法是在初始加载时急切地使用一个AJAX请求加载数据，并将其存储在变量而不是DOM中。

/**
 * @param $id
 * @throws NotFoundHttpException
 */
public function actionGetCourseDetails()
{
    $models = YourModel::find()->all();   
    $list = ArrayHelper::map($models, 'course_code', 'course_details');

    return ['courseDetails' => $list];
}

详细信息按代码编制索引，以便您轻松检索它：

$(function() {
    var courseDetails;

    loadCourseDetails();

    function loadCourseDetails() {
        $.get('get-course-details', function(data) {
            var courseDetails(data.courseDetails);
        }).fail(function() {
            alert('Failed to get course details');
        });
    }    

    $('#select-id').change(function() {
        $('#text-input-id').text(courseDetails[$this.val()]);
    });
});

Yii2 - 如何从DropDownList更新textInput值

1 个答案: