yii2选择地区时如何实现三级联动 [ 2.0 版本 ]

表结构

$this->createTable('{{%area}}', [
    'id' => $this->primaryKey(6),
    'name' => $this->string(45),
    'pid' => $this->integer(6),
    'code' => $this->string(5),
    'level' => $this->integer(1),
    'typename' => $this->string(4),
], $tableOptions);

需要在表单页面中地址能显示到默认的位置

已经解决了，有空把解决就把解决方案以视频形式发出来

解决方式：

1.在模型中定义省市区三个字段，并在afterFind方法中给新增字段赋值

class UserInformation extends \yii\db\ActiveRecord
{
    public $province_area_id = 0;
    public $city_area_id = 0;
    public $county_area_id = 0;

    public function afterFind()
    {
        parent::afterFind(); // TODO: Change the autogenerated stub
        $this->setProvinceCityCounty($this->area_id);
    }

    private function setProvinceCityCounty($area_id)
    {
        $Area = new Area();
        $area_info = $Area::findOne($area_id);
        if($area_info){
            switch($area_info->level){
                case 1:
                    $this->province_area_id = $area_info->id;
                    break;
                case 2:
                    $this->province_area_id = $area_info->pid;
                    $this->city_area_id = $area_info->id;
                    break;
                case 3:
                    $this->province_area_id = $Area::getParentId($area_info->pid);
                    $this->city_area_id = $area_info->pid;
                    $this->county_area_id = $area_info->id;
                    break;
            }
        }
    }
    ...
}

2.在Area模型中实现获取子列表方法

/**
 * This is the model class for table "{{%area}}".
 *
 * @property integer $id
 * @property string $name
 * @property integer $pid
 * @property string $code
 * @property integer $level
 * @property string $typename
 */
class Area extends \yii\db\ActiveRecord
{
    public $select_head = [
        ["id"=>0, "name"=>"请选择"],
        ["id"=>0, "name"=>"请选择省"],
        ["id"=>0, "name"=>"请选择市"],
        ["id"=>0, "name"=>"请选择区"],
    ];
    ...
    /**
     * 获取子列表
     * @param $pid
     * @return static[]
     */
    public static function getChildrenList($pid,$level=0)
    {
        $x[] = (new static)->select_head[$level];
        return array_merge($x,static::findAll(['pid'=>$pid]));
    }
}

3.用Html::activeDropDownList组件实现可编辑样式的下拉框，其中用onchange方法来实现ajax获取子列表，组件会根据值来设置默认选中的地区

<?= $form->field($UserInformation, 'area_id', [
                        'template'=>'{label}<div id="area_linkage"><div class="col-sm-3">'.
                            Html::activeDropDownList($UserInformation,'province_area_id', ArrayHelper::map($Area::getChildrenList(0,1), 'id', 'name'), [
                                'class' => 'form-control',
                                'onchange' => '
                                    $("#userinformation-area_id").val($(this).val());
                                    $.ajax({
                                        type:"post",
                                        url:"'.Yii::$app->urlManager->createUrl('/usercenter/area/ajax-post-children-area').'",
                                        data:{pid:$(this).val(),level:2},
                                        success:function(msg){
                                            $("#userinformation-city_area_id").html(msg);
                                            $("#userinformation-county_area_id").html(\'<option value="0">请选择区</option>\');
                                        }
                                    });
                                ',
                            ])
                            .'</div><div class="col-sm-3">'.
                            Html::activeDropDownList($UserInformation,'city_area_id', ArrayHelper::map($Area::getChildrenList($UserInformation->province_area_id,2), 'id', 'name'), [
                                'class' => 'form-control',
                                'onchange' => '
                                    $("#userinformation-area_id").val($(this).val());
                                    $.ajax({
                                        type:"post",
                                        url:"'.Yii::$app->urlManager->createUrl('/usercenter/area/ajax-post-children-area').'",
                                        data:{pid:$(this).val(),level:3},
                                        success:function(msg){
                                            $("#userinformation-county_area_id").html(msg);
                                        }
                                    });
                                ',
                            ])
                            .'</div><div class="col-sm-3">'.
                            Html::activeDropDownList($UserInformation,'county_area_id', ArrayHelper::map($Area::getChildrenList($UserInformation->city_area_id,3), 'id', 'name'), [
                                'class' => 'form-control',
                                'onchange' => '
                                    $("#userinformation-area_id").val($(this).val());
                                ',
                            ])
                            .'</div><div class="hidden" id="parent_div_area_id">{input}</div></div>',
])->hiddenInput(); ?>

/usercenter/area/ajax-post-children-area方法：

class AreaController extends UserCenterController
{
    public function actionAjaxPostChildrenArea()
    {
        if(\Yii::$app->request->isAjax){
            $pid = \Yii::$app->request->post('pid');
            $level = \Yii::$app->request->post('level');
            $area_children = Area::getChildrenList($pid,$level);
            $option = "";
            if(count($area_children)>0){
                foreach($area_children as $k => $v){
                    $option .= Html::tag('option',Html::encode($v['name']),['value'=>$v['id']]);
                }
            }
            echo $option;
        }
    }
}