Yii2 如何实现二级联动?

Yii · caicai · 于 2年前 发布 · 8271 次阅读

视图

场景:点击一个分类,更换一个URL

<?php $form = ActiveForm::begin([
    'id'     => strtolower($model->formName()),
    'action' => ['/apitools/default/index']
]); ?>

<?= $form->field($model, 'type')->dropDownList(
    ApiTool::getType(),
    ['prompt' => '选择一个分类']
) ?>
<?= $form->field($model, 'url')->dropDownList(
    [],
    ['prompt' => '选择一个url']
) ?>
<?php ActiveForm::end(); ?>

jQuery

关于 JsBlock,参考这篇文章:Yii2 如何更好的在页面注入JavaScript

<?php JsBlock::begin() ?>
    <script>
            jQuery("#apitool-type").change(function () {
                var html = '';
                $.ajax({
                    url: '<?= \yii\helpers\Url::to(["/apitools/default/type-list"]) ?>',
                    type: 'GET',
                    dataType: 'json',
                    data: {type: $(this).val()},
                    success: function (msg) {
                        $.each(msg, function (key, val) {
                            html += '<option value="' + key + '">' + val + '</option>';
                        });
                        $("#apitool-url").html(html);
                    }
                })
            });
        });
    </script>
<?php JsBlock::end() ?>

Controller

返回JSON的 key-value

public function actionTypeList()
{
    $type = \Yii::$app->request->get('type');
    return Json::encode(ApiTool::getUrl($type));
}
本帖已被设为精华帖!
共收到 7 条回复 Yii2 Ajax Form
lemon#12年前 0 个赞

good!

lemon#22年前 0 个赞

good

lemon#32年前 0 个赞

good share!

4楼 已删除.
hrbwaxdoll#51年前 0 个赞

感谢分享,特意上来纠正一个bug哈

$.each(msg, function (key, val) {
                    html += '<option value="' + val['id'] + '">' + val['pointname'] + '</option>';
                });

我的JSON是多条记录的,因此用key和val是不对的~所以~~用val[字段名]即可获取。

RedSun#61个月前 0 个赞

按照这个方法能否实现三级联动 我在做三级联动的过程中遇到问题~ 第三级的数据能够取到,但是$.each执行不了,也不会报错 希望有人能帮忙解答或给个解决思路

echo#71个月前 0 个赞

@RedSun #6楼 有引入 JQuery 吧?

RedSun#822天前 0 个赞

@echo #7楼 有的 已经解决了 是因为没有将获取的数据是json格式的字符串 所以$.each执行不了,把它转成javascript对象,就可以了

添加回复 (需要登录)
需要 登录 后方可回复, 如果你还没有账号请点击这里 注册