包 | zii.widgets.jui |
---|---|
继承 | class CJuiTabs » CJuiWidget » CWidget » CBaseController » CComponent |
源自 | 1.1 |
版本 | $Id: CJuiTabs.php 3400 2011-09-22 00:47:39Z sebathi $ |
源码 |
CJuiTabs显示一个选项卡部件。
CJuiTabs封装了JUI tabs 插件。
使用这个部件,你可以在视图里面插入以下代码:
通过配置options属性, 你可以指定需要传递给JUI tabs插件的选项。 如果需要选择(name-value pairs), 请参阅JUI tabs说明。
CJuiTabs封装了JUI tabs 插件。
使用这个部件,你可以在视图里面插入以下代码:
$this->widget('zii.widgets.jui.CJuiTabs', array( 'tabs'=>array( 'StaticTab 1'=>'Content for tab 1', 'StaticTab 2'=>array('content'=>'Content for tab 2', 'id'=>'tab2'), // panel 3 contains the content rendered by a partial view 'AjaxTab'=>array('ajax'=>$ajaxUrl), ), // additional javascript options for the tabs plugin 'options'=>array( 'collapsible'=>true, ), ));
通过配置options属性, 你可以指定需要传递给JUI tabs插件的选项。 如果需要选择(name-value pairs), 请参阅JUI tabs说明。
公共属性
属性 | 类型 | 描述 | 定义在 |
---|---|---|---|
actionPrefix | string | actions的ID的前缀。 当微件在CController::actions中声明了 动作提供者,可以为其动作的ID指定前缀以区别 于别的微件或控制器。当微件用于控制器 的视图中时,必须配置同样的前缀。 | CWidget |
contentTemplate | string | 用来产生每个标签内容的模板。 标记“{content}”在模板面板的内容将被替换, 同时标记“{id}”替换为标签ID. | CJuiTabs |
controller | CController | 返回此微件所属的控制器。 | CWidget |
cssFile | mixed | 主题的CSS文件名。默认是‘jquery-ui. | CJuiWidget |
headerTemplate | string | 所使用的每个面板的标题产生的模板。 标记“{title}”模板将被替换面板的标题, 并且标记“{url}”将被替换用“#TabID”或Ajax请求的URL。 | CJuiTabs |
htmlOptions | array | JUI组件中HTML标签的属性设置。 | CJuiWidget |
id | string | 返回此微件的ID。如果需要的话,将生产一个新的ID并将其返回。 | CWidget |
options | array | the 初始的JavaScript需要传递给JUI插件的选项。 | CJuiWidget |
owner | CBaseController | 返回此微件的所有者或创建者。 | CWidget |
scriptFile | mixed | 主要JUI的JavaScript的文件名。默认是‘jquery-ui. | CJuiWidget |
scriptUrl | string | 包含所有JUI JavaScript文件的根目录。 如果没有设置这个属性(默认),Yii will publish the JUI package included in the zii release and use that to infer the root script URL. | CJuiWidget |
skin | mixed | 微件使用的皮肤的名称。默认为“default”。 如果此属性设置为false,微件将不会有皮肤被使用。 | CWidget |
tabs | array | 标签列表(tab title=>tab content)。
需要注意的是tab的标题不会被HTML-encoded。
tab的内容可以是一个字符串或数组。
当它是一个数组,它可以在以下两种格式之一:
array('id'=>'myTabID', 'content'=>'tab content') array('id'=>'myTabID', 'ajax'=>URL)‘id’的元素是可选的。第二种格式允许tab的内容被动态地从指定的URL通过AJAX获取。 该URL可以是一个字符串或一个数组。 如果一个数组,将归到一个使用URLCHtml::normalizeUrl. |
CJuiTabs |
tagName | string | 所有面板的容器元素的名称。默认为‘div’。 | CJuiTabs |
theme | string | JUI主题的名字。默认是‘base’。确保在themeUrl下有这样一个目录, 其名称是这个属性的值相同(区分大小写)。 | CJuiWidget |
themeUrl | string | 包含所有JUI的主题文件夹的根目录。 如果没有设置这个属性(默认), Yii will publish the JUI package included in the zii release and use that to infer the root theme URL. | CJuiWidget |
viewPath | string | 返回包含此微件所需的视图文件的路径。 | CWidget |
公共方法
受保护方法
方法 | 描述 | 定义在 |
---|---|---|
registerCoreScripts() | 注册核心的脚本文件。 | CJuiTabs |
registerScriptFile() | 注册一个JavaScript文件在scriptUrl下。 | CJuiWidget |
resolvePackagePath() | 确定JUI包安装路径。 | CJuiWidget |
属性详细
contentTemplate
属性
public string $contentTemplate;
用来产生每个标签内容的模板。 标记“{content}”在模板面板的内容将被替换, 同时标记“{id}”替换为标签ID.
headerTemplate
属性
public string $headerTemplate;
所使用的每个面板的标题产生的模板。 标记“{title}”模板将被替换面板的标题, 并且标记“{url}”将被替换用“#TabID”或Ajax请求的URL。
tabs
属性
public array $tabs;
标签列表(tab title=>tab content)。 需要注意的是tab的标题不会被HTML-encoded。 tab的内容可以是一个字符串或数组。 当它是一个数组,它可以在以下两种格式之一:
array('id'=>'myTabID', 'content'=>'tab content') array('id'=>'myTabID', 'ajax'=>URL)‘id’的元素是可选的。第二种格式允许tab的内容被动态地从指定的URL通过AJAX获取。 该URL可以是一个字符串或一个数组。 如果一个数组,将归到一个使用URLCHtml::normalizeUrl.
tagName
属性
public string $tagName;
所有面板的容器元素的名称。默认为‘div’。
方法详细
registerCoreScripts()
方法
protected void registerCoreScripts()
|
protected function registerCoreScripts()
{
parent::registerCoreScripts();
if(isset($this->options['cookie']))
Yii::app()->getClientScript()->registerCoreScript('cookie');
}
注册核心的脚本文件。 使用cookie选项时此方法重写父方法实现注册的cookie插件。
run()
方法
public void run()
|
public function run()
{
$id=$this->getId();
if (isset($this->htmlOptions['id']))
$id = $this->htmlOptions['id'];
else
$this->htmlOptions['id']=$id;
echo CHtml::openTag($this->tagName,$this->htmlOptions)."\n";
$tabsOut = "";
$contentOut = "";
$tabCount = 0;
foreach($this->tabs as $title=>$content)
{
$tabId = (is_array($content) && isset($content['id']))?$content['id']:$id.'_tab_'.$tabCount++;
if (!is_array($content))
{
$tabsOut .= strtr($this->headerTemplate, array('{title}'=>$title, '{url}'=>'#'.$tabId, '{id}'=>'#' . $tabId))."\n";
$contentOut .= strtr($this->contentTemplate, array('{content}'=>$content,'{id}'=>$tabId))."\n";
}
elseif (isset($content['ajax']))
{
$tabsOut .= strtr($this->headerTemplate, array('{title}'=>$title, '{url}'=>CHtml::normalizeUrl($content['ajax']), '{id}'=>'#' . $tabId))."\n";
}
else
{
$tabsOut .= strtr($this->headerTemplate, array('{title}'=>$title, '{url}'=>'#'.$tabId, '{id}'=>$tabId))."\n";
if(isset($content['content']))
$contentOut .= strtr($this->contentTemplate, array('{content}'=>$content['content'],'{id}'=>$tabId))."\n";
}
}
echo "<ul>\n" . $tabsOut . "</ul>\n";
echo $contentOut;
echo CHtml::closeTag($this->tagName)."\n";
$options=empty($this->options) ? '' : CJavaScript::encode($this->options);
Yii::app()->getClientScript()->registerScript(__CLASS__.'#'.$id,"jQuery('#{$id}').tabs($options);");
}
运行这个部件。 这个方法注册必要的javascript并渲染相应的HTML代码。