在介紹Yii內建UI元件之前,先介紹如何自訂元件,這樣也有助於理解CWidget的用法,自訂元件就是重載 CWidget 的init() 和 run() 方法。
class MyWidget extends CWidget{public function init(){// 此方法会被 CController::beginWidget() 调用} public function run(){// 此方法会被 CController::endWidget() 调用}}
本例透過擴充CInputWidget,定義一個值域輸入UI元件-RangeInputField,也就是允許使用者輸入兩個數字定義一個值 域範圍。 CInputWidget 支援使用CModel或直接使用變量,RangeInputField 也保留了這項傳統。
RangeInputField定義了三組屬性。
$attributeFrom 和 $attributeTo 用於CModel,配合CHtml的 activeXXX 方法,activeXXX可以自動產生文字方塊 的標籤和文字方塊。
屬性$nameFrom,$nameTo,$valueFrom,$valueTo 程式設計師可以自行定義文字方塊的標籤。
依照Yii 應用的預設目錄結構,新建立的RangeInputField 放在protected/components 目錄下,因此建立protected/components/RangeInputField.php
class RangeInputField extends CInputWidget{public $attributeFrom;public $attributeTo; public $nameFrom;public $nameTo; public $valueFrom;public $valueTo; function run(){if($this->hasModel()){ echo CHtml::activeTextField($this->model, $this->attributeFrom);echo ' -> '; echo CHtml::activeTextField($this->model, $this->attributeTo);}else{echo CHtml::textField($this->nameFrom,$this->valueFrom); echo ' -> ';echo CHtml::textField($this->nameTo,$this->valueTo);}} /*** @return boolean whether this widget * is associated with a data model.*/ protected function hasModel(){return $this->model instanceof CModel&& $this->attributeFrom!==null&& $this->attributeTo!==null;}}
了run 方法, init 使用其父類別中的方法。
下面 就可以來測試這個新建立的自訂UI元件RangeInputField, 我們使用FormModel (使用CModel)的方法來使用這個UI元件。
在protected/models下建立RangeFrom.php
class RangeForm extends CFormModel{public $from;public $to; function rules(){return array(array('from,to','numerical','integerOnly' =>true), array('from','compare','compareAttribute'=>'to','operator'=> '<=','skipOnError' => true),);}}
然後修改缺省Controller的缺省方法,protected/controllers/siteController.php 中 actionIndex 方法。
public function actionIndex(){$success=false;$model=new RangeForm(); if(!emptyempty($_POST['RangeForm'])){$model->attributes=$_POST['RangeForm'];if($model->validate()) $success=true; } $this->render('index', array('model' => $model,'success' => $success,));}
建立對應的View
Success! beginWidget('CActiveForm'); ?> errorSummary($model); ?> widget('RangeInputField',array('model'=>$model,'attributeFrom' => 'from','attributeTo' => 'to',)) ?>endWidget(); ?>
運行這個範例
以上就是PHP開發框架Yii Framework教學(10) UI元件自訂元件的內容,更多相關內容請關注PHP開發框架Yii Framework教學(10) UI元件自訂元件的內容,更多相關內容請注意PHP網(www.php .cn)!