Yii2 ActionColumn Duplicating Icons

Question

I am using the Yii2 Grid ActionColumn. I have a field in my Database called log_type with the values of either Risk Assessment or Documentation What I am trying to do is only show certain buttons when the log_type is Risk Assessment It works great for my PDF icon. But for my Yes and No Icons. It duplicates them only when set to show for Risk Assessment If I set it to show for Documentation It will only show 1 Checkmark instead of 2. See the code and screenshots:

  <?php
    $gridColumns = [
        [
        'class'=>'kartik\grid\ActionColumn',
        'header'=>'Action',
        'hAlign'=> GridView::ALIGN_CENTER,
        'vAlign'=>GridView::ALIGN_MIDDLE,
        'template'=>'{update}{view}{yes}{no}{pdf}',
        'buttons'=>[
            'pdf'=>function($url, $model){
                if($model->log_type == "Risk Assessment"){
                    return Html::a('<i class = "fa fa-file-pdf-o"></i>',
                    'pdf?id='.$model->id,[
                        'data-pjax'=>'0',
                        'target'=>'blank',
                    ]);
                }
            },
            'yes'=>function($url,$model){
                 return Html::a('<i class = "fa fa-check"</li>');
            }
        ],
        'visibleButtons'=>[
           'yes'=>function($model,$key,$index){
               if($model->log_type === 'Risk Assessment'){
                   return false; // Right here. If I change this to True I get the duplicate icons as shown in the screenshot. 
               }else{
                   return true;
               }
            }
        ],
        'urlCreator'=>function($action, $model, $key, $index){
            if($action === 'view' && $model->log_type === 'Risk Assessment'){
                $url = 'view-risk?id='.$model->id;
                return $url;
            }else if ($action === 'view' && $model->log_type === 'Documentation'){
                $url = 'view?id='.$model->id;
                return $url;
            }
            if($action === 'update' && $model->log_type === 'Risk Assessment'){
                $url = 'update-risk?id='.$model->id;
                return $url;
            }else if($action === 'update' && $model->log_type === 'Documentation'){
                $url = 'update?id='.$model->id;
                return $url;
            }
        }
    ],
    [
        'attribute'=>'id',
        'header' => 'ID',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>false,
    ],
    [
        'attribute'=>'description',
        'header' => 'Description',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
    [
        'attribute'=>'log_type',
        'header' => 'Log Type',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
    [
        'attribute'=>'development_type',
        'header' => 'Development Type',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
    [
        'attribute'=>'platform_type',
        'header' => 'Platform Type',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
    [
        'attribute'=>'security_risk',
        'header' => 'Secuirty Risk',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
    [
        'attribute'=>'comments',
        'header' => 'Comments',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
    [
        'attribute'=>'risk_accepted',
        'header' => 'Risk Accepted',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
    [
        'attribute'=>'approved',
        'header' => 'Approved',
        'hAlign' => GridView::ALIGN_CENTER,
        'vAlign' => GridView::ALIGN_MIDDLE,
        'filter'=>true,
    ],
]
    ?>

Duplicate Icons

Non-Duplicate Icons

Answer 1

I tried replicating your problem and I couldn't, but I think that it is related to this malformed tag:

'<i class = "fa fa-check"</li>'

You open an <i> tag, but close with <li>. When I used your code, I didn't get any icons to display, even after updating the line where your comment about the duplicate icons is.

There also maybe a problem with the fact that you are both displaying conditionally the buttons on buttons and, at the same time, using the visibleButtons attribute. I think that it would be better to use one or the other, i.e. use vibilbeButtons for the inbuilt view, update, delete buttons, and, when possible, add your own conditional logic on the buttons attribute. The examples on the Yii2 guide all do it that way.

You can update the manually generated tags to use the Kartik icon class to generate icons, and move all your logic inside buttons, having it all in the same place will make it easier to maintain, and it will work as expected:

'template' => '{update}{view}{yes}{no}{pdf}',
'buttons' => [
    'pdf' => function($url, $model) {
        return $model->log_type == "Risk Assessment" 
            ? Html::a(Icon::show('file-pdf'),
                ['pdf/view', 'id' => $model->id] , [
                'data-pjax'=>'0',
                'target'=>'blank',
            ]) : '';
    },
    'yes' => function($url,$model) {
             return $model->log_type === 'Risk Assessment' 
                 ? Html::a(Icon::show('check'), ['controller/action', 'id' => $model->id]) : '';
    },
    ...
    ],
    'visibleButtons'=>[],
...