2013-08-23 76 views
0

我刚刚为CGridView列创建Button dropdowns's Twitter Bootstrap。该按钮包含子菜单,并且它们中的每一个都具有诸如href,class,data-等的属性。它们可以通过设置为下拉菜单项属性在CGridView小部件中。CGridView自定义列与按钮下拉的Twitter引导

鉴于

$this->widget('zii.widgets.grid.CGridView', array(
    'dataProvider'=>$dataProvider, 
    'ajaxUpdate'=>false, 
    'columns'=>array(
     array(
      'name'=>'ID', 
      'type'=>'raw', 
      'value'=>'$data->ID', 
     ), 
     array(
      'name'=>'NAME', 
      'type'=>'raw', 
      'value'=>'$data->NAME', 
     ), 
     array(
      'class'=>'BootstrapButtonDropdownColumn',          
      'name'=>'', 
      'sortable'=>false, 
      'dropdownMenuItems'=>array(
       array('label'=>'<i class="icon-edit"></i> Edit', 'link'=>$this->createUrl('site/update')), 
       array('itemClass'=>'divider'), 
       array('label'=>'<i class="icon-remove"></i> Remove', 'link'=>'#', 'itemHtmlOptions'=>array('class'=>'remove-item','data-id'=>'$data->ID','data-toggle'=>'modal')) 
     ), 
    ),            
), 

类文件

class BootstrapButtonDropdownColumn extends CDataColumn { 

    public $buttonLabel = 'Action'; 
    public $buttonClass = 'btn btn-small dropdown-toggle'; 
    public $buttonHtmlOptions=array(); 
    public $dropdownMenuItems=array(); 

    protected function renderDataCellContent($row, $data) 
    { 
     $html = '<div class="btn-group pull-right">'; 

     $buttonOption = $this->buttonHtmlOptions; 
     $buttonOption['class'] = $this->buttonClass; 
     $buttonOption['data-toggle'] = 'dropdown'; 
     $html .= CHtml::htmlButton($this->buttonLabel . ' <span class="caret"></span>', $buttonOption);  

     $html .= '<ul class="dropdown-menu">'; 

     for ($i=0; $i<count($this->dropdownMenuItems); $i++) 
     { 
      if (isset($this->dropdownMenuItems[$i]['itemClass'])) 
       $html .= '<li class="' . $this->dropdownMenuItems[$i]['itemClass'] . '">'; 
      else 
       $html .= '<li>'; 

      $label = ''; 
      $link = '#'; 
      $itemHtmlOptions = null; 

      if (isset($this->dropdownMenuItems[$i]['label'])) 
       $label = $this->dropdownMenuItems[$i]['label']; 

      if (isset($this->dropdownMenuItems[$i]['link']) && !empty($this->dropdownMenuItems[$i]['link'])) 
       $link = $this->dropdownMenuItems[$i]['link']; 

      if (isset($this->dropdownMenuItems[$i]['itemHtmlOptions'])) 
       $itemHtmlOptions = $this->dropdownMenuItems[$i]['itemHtmlOptions']; 

      $html .= CHtml::link($label, $link, $itemHtmlOptions); 
      $html .= '</li>'; 
     } 

     $html .= '</ul></div>'; 
     echo $html; 
    } 
} 

有一个问题,我想设置值数据-id属性上删除的菜单项,但它不能正常工作。当在浏览器元素检查中看到时,data-id不包含记录编号,但它显示字符串$ data-> id代替

<div class="btn-group pull-right open"> 
     <button class="btn btn-small dropdown-toggle" data-toggle="dropdown" name="yt0" type="button"> 
      Action <span class="caret"></span> 
     </button> 
     <ul class="dropdown-menu"> 
      <li><a href="/site/update"><i class="icon-edit"></i> Edit</a></li> 
      <li class="divider"><a href="#"></a></li> 
      <li><a class="remove-item" data-id="$data->ID" data-toggle="modal" href="#"><i class="icon-remove"></i> Remove</a></li> 
     </ul> 
    </div> 

或看到在这个image

请给我一些建议,谢谢。

+0

指向该页面或截图的链接将有所帮助。 –

+0

这很奇怪,即使它错了,它应该显示$ data-> ART_CAT_ID而不是$ data-> ID –

+0

您的代码错误,因为您无法访问$ data,而html选项会直接传递到自定义类像什么'价值'对待列表达式 –

回答

0

感谢的建议,但有另一种方式来传递ID写入

您有权访问$row$data能力。我认为,所有你只需要增加更多的下面一行到您的自定义按钮

if (isset($this->dropdownMenuItems[$i]['itemHtmlOptions'])){ 
       $itemHtmlOptions = $this->dropdownMenuItems[$i]['itemHtmlOptions']; 
       $itemHtmlOptions['data-id'] = $data->ID; // <==added line, maybe you want to use condition or put it somewhere else instead, depend your decision 
      } 

因为现在你不需要从您的视图'data-id'=>$data->ID下去了,将其删除。

+0

工作很好,谢谢你。 – KKK