CGridView自定義列與按鈕下拉的Twitter引導

我剛剛爲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

請給我一些建議，謝謝。

來源

2013-08-23 KKK

指向該頁面或截圖的鏈接將有所幫助。 –

這很奇怪，即使它錯了，它應該顯示$ data-> ART_CAT_ID而不是$ data-> ID –

您的代碼錯誤，因爲您無法訪問$ data，而html選項會直接傳遞到自定義類像什麼'價值'對待列表達式 –

感謝的建議，但有另一種方式來傳遞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下去了，將其刪除。

來源

2013-08-23 09:48:52

工作很好，謝謝你。 – KKK

CGridView自定義列與按鈕下拉的Twitter引導

回答

相關問題