2017-04-27 94 views
0

我想在Yii2中创建一个dependend dropDownList。我正在尝试使用DepDrop Widget,但我无法理解如何根据自己的情况编辑代码。我有1个模型,里面我需要做类别下拉列表,根据category_id,下一个dropDownList应该是Item。 (如果我选择类别1,该项目应该是Item1等等)。如何在Yii2中创建相关的下拉列表?

我想扩展只能做同一模型的下拉?我是Yii2的新手,所以。

view文件:

<div class="site-create"> 

<?php $form = ActiveForm::begin(); ?> 

    <?= $form->field($model, 'code') ?> 
    <?= $form->field($category, 'id')->dropDownList($category, ['id'=>'category-id']); ?> 
    <?= $form->field($item, 'subcat')->widget(DepDrop::Item(), [ 
     'options'=>['id'=>'item-id'], 
     'pluginOptions'=>[ 
     'depends'=>['category-id'], 
     'placeholder'=>'Select...', 
     'url'=>Url::to(['/site/subcat']) 
     ] 
    ]); ?> 

$model$category$item不同的模式。我把这些变量在行动

这是我action使用不同的模式:

public function actionSubcat() { 
    $category = new Category(); 
    $item = new Item(); 
    $out = []; 
    if (isset($_POST['depdrop_parents'])) { 
     $parents = $_POST['depdrop_parents']; 
     if ($parents != null) { 
      $cat_id = $parents[0]; 
      $out = self::getSubCatList($cat_id); 
      echo Json::encode(['output'=>$out, 'selected'=>'']); 

     return $this->render('create', [ 
       'category' => $category, 
       'item' => $item, 
      ]); 
     } 
    } 
    echo Json::encode(['output'=>'', 'selected'=>'']); 
} 
} 

现在我得到的错误信息,即$category变量是不确定的。有人能解释我做错了什么吗?

回答

0

我建议使用knockoutjs来做到这一点。 i answered a similar question here 淘汰赛example is here(类别>产品)

HTML:

<select data-bind="options: data, value: selected, optionsText: 'title', optionsCaption: '---'"></select> 
<select data-bind="options: dependent"></select> 

的javascript:

<script> 
    function viewmodel() { 
     var self = this; 

     this.data = [ 
      { title: 'title a', items: ['a1', 'a2', 'a3'] }, 
      { title: 'title b', items: ['b1', 'b2', 'b3'] }, 
      { title: 'title c', items: ['c1', 'c2', 'c3'] } 
     ]; 

     this.selected = ko.observable(); 
     this.dependent = ko.computed(function() { 
      return ((self.selected() || {}).items || []); 
     }); 

    } 

    $(document).ready(function() { 
     ko.applyBindings(new viewmodel()); 
    }); 
</script> 

你仍然可以使用$form->field,只需添加'data-bind'属性为inputOption。 如果你想使用该字段的默认值,Json::encode这些键值对,并创建这样的视图模型:使用这些参数

ko.applyBindings(new viewmodel(<?= Json::encode($data) ?>)); 

是JavaScript的体力劳动

0

其实你不需要任何小工具或插件。在yii2您可以方便地在这里做相关下拉列表例如:

echo $form->field($search,'category')->dropDownList(
    ArrayHelper::map(
     \app\models\Category::find()->all(), 
     'id','name' 
    ), 
    [ 
     'prompt' => Yii::t('app','choose_city'), 
     'onchange'=>' 
     $.get("'.Yii::$app->urlManager->createUrl('site/dropdown?id=').'"+$(this).val(), function(data) { 
     $("select#subcat").html(data); 
     })' 
    ] 
); 
echo $form->field($search, 'sub_category', ['inputOptions'=>['id'=>'subcat',]])->dropDownList([]); 

之后,你需要返回行动创建行动。例如:

public function actionDropdown($id) 
{ 
    $countPosts = \app\models\SubCategory::find() 
     ->where(['category_id' => $id]) 
     ->count(); 

    $posts = \app\models\SubCategory::find() 
     ->where(['category_id' => $id]) 
     ->orderBy('name ASC') 
     ->all(); 
    echo "<option value=''>-</option>"; 
    if($countPosts>0){ 
     foreach($posts as $post){ 
      echo "<option value='".$post->id."'>".Yii::t('app',$post->name)."</option>"; 
     } 
    } 

} 

这就是所有。