Yii多重依赖下拉列表

Question

I'm new to Yii Framework. I'm making multiple dependent drop downs. Islands Regions Provinces Cities

I have a dropdown of Islands, when you select an Islands, Regions dropdown list will be updated and only regions that belongs to that Island will appear. Same things goes to Provinces and Cities.

Now, I already finished Islands. When you select an Island, only Regions that belongs to that Island will be appear. My problem is the second level to down. When I select region, only provices that belongs to that region will appear. I have coded it the same way and logic as the first but I'm not getting any output or errors. I'm using Ajax. Can you help me? Thanks

Here's my VIEW

<div class="row">
    <?php echo $form->labelEx($model,'island'); ?>
    <?php
        echo $form->dropDownList($model,'island',CHtml::listData(Islands::model()->findAll(), 'IslandID', 'IslandName'),
        array(
        'prompt'=>'Select Island',
        'ajax' => array(
        'type'=>'POST', 
        'url'=>CController::createUrl('loadRegions'), //or $this->createUrl('loadcities') if '$this' extends CController
        'update'=>'#region', //or 'success' => 'function(data){...handle the data in the way you want...}',
        'data'=>array('IslandID'=>'js:this.value'),
        ))
    );
    ?>
</div>

<div class="row">
    <?php echo $form->labelEx($model,'region'); ?>
    <?php
        /*echo $form->dropDownList($model,'region',CHtml::listData(Regions::model()->findAll(), 'RegionID', 'RegionName'),
        array('class'=>'span4 chosen','maxlength'=>20)*/
        echo CHtml::dropDownList('region','', array(), array('prompt'=>'Select Region'),
        array(
        'ajax' => array(
        'type'=>'POST', 
        'url'=>CController::createUrl('loadProvinces'), //or $this->createUrl('loadcities') if '$this' extends CController
        'update'=>'#province', //or 'success' => 'function(data){...handle the data in the way you want...}',
        'data'=>array('region'=>'js:this.value'),
        ))

    );

    ?>
</div>

<div class="row">
    <?php echo $form->labelEx($model,'province'); ?>
    <?php
        echo CHtml::dropDownList('province','', array(), array('prompt'=>'Select Province'));
    ?>  
</div>

Here's my Controller

/* Function for dependent dropdown */
public function actionLoadRegions()
{

   $data=Regions::model()->findAll('IslandID=:IslandID', 
   array(':IslandID'=>(int) $_POST['IslandID']));

   $data=CHtml::listData($data,'RegionID','RegionName');

   foreach($data as $value=>$region)
   echo CHtml::tag('option', array('value'=>$value),CHtml::encode($region),true);
}

public function actionLoadProvinces()
{
    //var_dump($_POST['region']);

    $data=Provinces::model()->findAll('RegionID=:RegionID', 
    array(':RegionID'=>(int) $_POST['RegionID']));

   $data=CHtml::listData($data,'ProvinceID','ProvinceName');

   foreach($data as $value=>$province)
   echo CHtml::tag('option',                         array('value'=>$value),CHtml::encode($province),true);
}

I just followed this but on Multiple Dropdowns, seems it doesn't work? Thanks!

Answer 1

Try

    <?php echo CHtml::activeDropDownList($model,'region',array(),array(prompt'=>'Select Region'),'ajax' => array(
    'type'=>'POST', 
    'url'=>CController::createUrl('loadProvinces'), //or $this->createUrl('loadcities') if '$this' extends CController
    'data'=>array('region'=>'js:this.value'),
    'update'=>'#'.CHtml::activeId($model,'province'),
          )
        )); ?>

Also

  <?php echo CHtml::activeDropDownList($model,'province', array(),array('prompt'=>'Choose Province')); ?>

Answer 2

Example program, similar to your requirement.

Below are Islands , Regions , Provinces tables

Islands table

 Islands
 -------
 IslandID
 IslandName

Regions table

 Regions
 ---------
 RegionID
 RegionName
 IslandID

Provinces table

 Provinces
 ----------
 ProvinceID
 ProvinceName
 IslandID
 RegionID

Assume that i'm programming user registration. So, $model is an instance/object of User model

My View

 Select Island 
 <?php
    echo $form->dropDownList($model,'IslandID',CHtml::listData(Islands::model()->findAll(), 'IslandID', 'IslandName'),
     array(
        'prompt'=>'Select Island',
        'ajax' => array(
            'type' => 'POST', //My method type
            'url' => CController::createUrl('myController/LoadRegions'), //This is my request/ajax URL
            array('IslandID'=>'js:this.value'), //I'm passing the selected dropdonw value.
            'dataType' => 'JSON', 
            'success'=>'js:function(data)' //The functionaliy after success
            . '{'
            . '    var html="";'
            . '    $.each(data,function(i,obj)'
            . '    {'
            . '         html+="<option value=obj.RegionID>"+obj.RegionName+"</option>"'
            . '    });'
            . '    $("#User_RegionID").html(html);' //ID of regions dropdown list
            . '}' 

    )));
);
?>

Select Region
<?php
echo CHtml::dropDownList($model,'RegionID', array(), array('prompt'=>'Select Region'));
?>

For this dropDownlist id will be generated as User_RegionID. ie, A feild id will be generated with combination of Model name and field name centering with underscore "_".

EX:

1. ModelName_FieldName
2. City_Id (City is Model and Id is property/field in the City model)

Controller Method

public function actionLoadRegions()
{

    $IslandID=$_POST['IslandID'];

    $criteria=new CDbCriteria();
    $criteria->select=array('RegionID,RegionName');
    $criteria->condition='IslandID='.$IslandID;
    $criteria->order='RegionName';
    $RegionsAry= Regions::model()->findAll($criteria);

    $ary=array();
    foreach($RegionsAry as $i=>$obj)
    {
         $ary[$i]['RegionID']=$obj->RegionID;
         $ary[$i]['RegionName']=$obj->RegionName;            
    }
    echo json_encode($ary);
}

To get the Provinces list on selecting Regions

Select Region
<?php
echo CHtml::dropDownList($model,'RegionID', array(),
array(
  'prompt'=>'Select Region'
  'ajax' => array(
       'type' => 'POST', //My method type
       'url' => CController::createUrl('myController/LoadProvinces'), //This is my request/ajax URL
       array('RegionID'=>'js:this.value'), //I'm passing the selected dropdonw value.
            'dataType' => 'JSON', 
            'success'=>'js:function(data)' //The functionaliy after success
            . '{'
            . '    var html="";'
            . '    $.each(data,function(i,obj)'
            . '    {'
            . '         html+="<option value=obj.ProvinceID>"+obj.ProvinceName+"</option>"'
            . '    });'
            . '    $("#User_ProvinceID").html(html);' //ID of Province dropdown list
            . '}' 
));
?>

Select Provinces
<?php
echo CHtml::dropDownList($model,'ProvinceID', array(), array('prompt'=>'Select Province'));
?>

Controller method to get all Provinces

public function actionLoadProvinces()
{
     //To your task
}

Answer 3

You have no problem in controller file. I think you have problem in view file . Especially, in your Select Region Part . Here is my updated code of your view file. Please delete 1 argument array() and check it.

<div class="row">
<?php echo $form->labelEx($model,'region'); ?>
<?php
    echo $form->dropDownList($model,'region',CHtml::listData(Regions::model()->findAll(), 'RegionID', 'RegionName'),
    array('class'=>'span4 chosen','maxlength'=>20)*/
    echo CHtml::dropDownList('region','', array('prompt'=>'Select Region'),**//Here i remove array() and it works.**
    array(
    'ajax' => array(
    'type'=>'POST', 
    'url'=>CController::createUrl('loadProvinces'), //or $this->createUrl('loadcities') if '$this' extends CController
    'update'=>'#province', //or 'success' => 'function(data){...handle the data in the way you want...}',
    'data'=>array('region'=>'js:this.value'),
    ))

);

?>