Yii2 如何实现二级联动？

admin

视图
场景：点击一个分类，更换一个URL

1. <?php $form = ActiveForm::begin([
   
2.     'id'     => strtolower($model->formName()),
   
3.     'action' => ['/apitools/default/index']
   
4. ]); ?>
   
5. 
   
6. <?= $form->field($model, 'type')->dropDownList(
   
7.     ApiTool::getType(),
   
8.     ['prompt' => '选择一个分类']
   
9. ) ?>
   
10. <?= $form->field($model, 'url')->dropDownList(
    
11.     [],
    
12.     ['prompt' => '选择一个url']
    
13. ) ?>
    
14. <?php ActiveForm::end(); ?>

复制代码

jQuery
关于 JsBlock，参考官方文档

1. <?php JsBlock::begin() ?>
   
2.     <script>
   
3.             jQuery("#apitool-type").change(function () {
   
4.                 var html = '';
   
5.                 $.ajax({
   
6.                     url: '<?= \yii\helpers\Url::to(["/apitools/default/type-list"]) ?>',
   
7.                     type: 'GET',
   
8.                     dataType: 'json',
   
9.                     data: {type: $(this).val()},
   
10.                     success: function (msg) {
    
11.                         $.each(msg, function (key, val) {
    
12.                             html += '<option value="' + key + '">' + val + '</option>';
    
13.                         });
    
14.                         $("#apitool-url").html(html);
    
15.                     }
    
16.                 })
    
17.             });
    
18.         });
    
19.     </script>
    
20. <?php JsBlock::end() ?>

复制代码

Controller
返回JSON的 key-value

1. public function actionTypeList()
   
2. {
   
3.     $type = \Yii::$app->request->get('type');
   
4.     return Json::encode(ApiTool::getUrl($type));
   
5. }

复制代码