利用yii framework dropdown 創建級聯選單

利用yii framework dropdown 創建級聯選單 


你經常需要一個表單，級聯城市，或者級聯的分類等等功能，其中有兩個下拉框，一個的值依賴於另一個下拉框。使用Yii 內建的 ajax 功能，你可以建立這樣一個下拉框。下面將示範如何實作它。 

首先是表單的檢視。我們將展示一個表單，顯示國家，以及根據國家將顯示它的城市。
程式碼程式碼 
echo CHtml::dropDownList('country_id','', array(1=>'USA',2=>'France',3=>'Japan'), 
array(
'ajax' => array( 
'type'=>'POST', //request type 
'url'=>'dynamiccities', //url to call 
'update'=>'#city_id', //url to call 
'update'=>'#city_id', // selector to update 
//'data'=>'js:javascript statement' 
//leave out the data key to pass all form values through 
))); 

//empty comsince y

//empty comsince the /empty 外翻
echo CHtml::dropDownList('city_id','', array()); 
?> 


第一個下拉框由幾個代表國家的value/name 對組成。 。當它被改變時，一個 ajax 請求將被目前 controller 的 'dynamiccities' action完成。請求的結果( 'dynamiccities' action的輸出) 將會被替換到第二個id 是#city_id的下拉方塊。 

接下來是 controller action，它將輸出 html 以填滿第二個下拉框。此外它將依賴第一個下拉框的值。
程式碼程式碼 
public function actionDynamiccities() 
{ 
     $data=Location::model()->findAll   array(':parent_id'=>(int) $_POST['country_id'])); 

    $data=CHtml::listData($data,'id','name'); 
    foreach($data as $ ::tag('option', 
                   array('value'=>$value),CHtml::encode($name),true); ;將檢索所有parent_id 是第一個下拉框值的城市。然後將輸出所有這些城市到標籤中，最終形成第二個下拉框。

你可能想知道 $_POST['country_id'] 來自哪裡。非常簡單，當第一個下拉框中的 ajax 數組的 'data' 鍵為空時，下拉框所在表單所有元素的值將傳遞到 controller ，透過 ajax 請求。若你在使用 Firebug 你可以查看這個請求。 

這個 behaviour 也可以被改。預設地，ajax 配置數組 中 'data' 鍵的值是 js:jQuery(this).parents("form").serialize()。 開頭的 js: 告訴 Yii 後面接的是一個 javascript 語句，不應被轉義。因此，若你改變 'data' 鍵為另外以 'js:' 開始的語句，你可以填入自己的語句。也適用於 'success' 參數。