Search code examples
yii2yii2-basic-app

Yii2 : Dependent Dropdown List to search


I want to create a filter for user to search. I create this dependent dropdownlist but it not work. I have 'city' and 'state' tables. It not working. ERROR in conslode POST http://localhost/smarthouse/web/index.php?r=post/lists?id=1 404 (Not Found)

Can someone tell me where I went wrong? Thanks.

My form

    <?php
 $dataCity=ArrayHelper::map(\app\models\Cities::find()->
 asArray()->all(),'id', 'name');    
              $form = ActiveForm::begin();
            echo $form->field($searchModel, 'id')->dropDownList($dataCity, 
                                 [''=>'-Choose a Name-',
                                     'class'=>'adjust',
                      'onchange'=>'
         $.post("index.php?r=post/lists?id='.
       '"+$(this).val(),function( data ) 
               {
                          $( "select#post" ).html( data );
                        });
                    ']); 

            $dataState=ArrayHelper::map(\app\models\States::find()->
             asArray()->all(), 'id', 'name');
          echo $form->field($searchModel, 'id')
                ->dropDownList(
                    $dataState,   
                     ['id'=>'name',
                         'class'=>'adjust'
                         ]
                );
             ActiveForm::end(); 
           ?>

My list action in post controller

public function actionLists($id)
  {
     $countPosts = States::find()
     ->where(['city_id' => $id])
     ->count();

     $posts = States::find()
     ->where(['city_id' => $id])
     ->orderBy('id DESC')
     ->all();

     if($countPosts>0){
     foreach($posts as $post){

     echo "<option value='".$post->id."'>".$post->name."</option>";
     }
     }
     else{
     echo "<option>-</option>";
     }

Solution

  • In your onchange $.post path the second GET parameter should begin with & and not with ? this way `index.php?r=post/lists&id

     'onchange'=>'
         $.post("index.php?r=post/lists&id='. // use & not ? 
       '"+$(this).val(),function( data ) 
               {
                          $( "select#post" ).html( data );
                        });
                    '