PHP開發架構Yii Framework教程(35) Zii組件-Button樣本

CJuiButton 顯示按鈕，CJuiButton 既可以做為Submit（提交）按鈕，也可以做為普通按鈕。

按鈕基本用法如下：

<?php $this->widget('zii.widgets.jui.CJuiButton', array('buttonType'=>'submit','name'=>'btnSubmit','value'=>'1','caption'=>'Submit','htmlOptions'=>array('class'=>'ui-button-primary'))); ?> <?php $this->widget('zii.widgets.jui.CJuiButton', array('buttonType'=>'button','name'=>'btnClick','caption'=>'Click',//'options'=>array('icons'=>'js:{primary:"ui-icon-newwin"}'),'onclick'=>'js:function(){alert("clicked"); this.blur(); return false;}',)); ?> <?php $this->widget('zii.widgets.jui.CJuiButton', array('buttonType'=>'link','name'=>'btnGo','caption'=>'Go',//'options'=>array('icons'=>'js:{secondary:"ui-icon-extlink"}'),'url'=>array('site/other'),)); ?>

這三個按鈕，第一個做為Submit按鈕，第二個作為普通按鈕，觸發JavaScripts事件，第三個點擊後觸發otherAction 方法。

顯示結果如下：

可以為Jui UI組件添加CSS檔案，這可以通過設定檔來設定CSS檔案：

'components'=>array('clientScript' => array('scriptMap' => array('jquery-ui.css'=> dirname($_SERVER['SCRIPT_NAME'])  .'/css/jui/custom/jquery-ui.css',),),),

這裡我們複製YiiPlayground使用的JQuery CSS檔案 ，使用新CSS風格後顯示如下：

查看全套教程：http://www.bianceng.cn/webkf/PHP/201301/35265.htm

本例下載：http://www.imobilebbs.com/download/yii/JuiButtonDemo.zip