How add one more button to yii2-widget-fileinput?

Question

I want more button in yii2-fileinput-widget.

My current code is like this:

$allPics = \common\models\Picture::getPictures($album->id);
$images = [];
$imagesOptions = [];
if($allPics){
    foreach ($allPics as $pic){
         $key = $pic->id;
         $url = Url::to(['set-pic-status', 'id'=>$key, 'pid'=>$model->id, 'do'=>'remove']);
         $images[] = Yii::$app->urlManagerFront->createAbsoluteUrl(['image/index', 'id'=>$pic->id, 'width'=>300, 'height'=>300]);
         $imagesOptions[] = ['caption' => $pic->name, 'size' => $pic->size , 'url'=>$url, 'key'=>$key];
    }
} 
echo FileInput::widget([
     'name' => 'pic',
     'language'=>'fa',
     'options'=>[
         'multiple'=>true
     ],
     'pluginOptions' => [
         'uploadUrl' => Url::to(['pic-upload', 'id'=>$model->id]),
         'initialPreview'=>$images,
         'initialPreviewAsData'=>true,
         'initialCaption'=>"تصاویر محصول",
         'initialPreviewConfig' => $imagesOptions,
         'overwriteInitial'=>false,
         'maxFileSize'=>2800,
     ]
]);

And result of top code is:

Now I need add one more button near remove button to send some data to server and set selected picture as cover or change status of picture in db.

How can I do that?

Answer 1

try this:

$initialPreview = [];
$initialPreviewConfig = [];
foreach($model->images as  $image){
$initialPreview[] = Html::img($image->imagePath,['width' =>200]);
$initialPreviewConfig[] = [
    'url' => \yii\helpers\Url::to(['/admin/portfolio/portfolio/image-delete']),
    'key' => $image->ID,

];
}

?>
<br>
<div class="row">
    <div class="col-md-12">
        <?php
        echo FileInput::widget([
            'name' => 'ProductImages[]',
            'options'=>['accept'=>'image/*','multiple' => true],
            'pluginOptions' => [
                'otherActionButtons' => '<button class="set-main" type="button" {dataKey} ><i class="glyphicon glyphicon-star"></i></button>',
                'overwriteInitial'=>false,
                'maxFileSize'=>2800,
                'fileActionSettings' => [
                    'fileActionSettings' => [
                        'showZoom' => false,
                        'showDelete' => true,
                    ],
                ],
                'browseClass' => 'btn btn-success',
                'uploadClass' => 'btn btn-info',
                'removeClass' => 'btn btn-danger',
                'showRemove' => false,
                'showUpload' => false,
                'initialPreview' => $initialPreview,
                'initialPreviewConfig' => $initialPreviewConfig,

            ],

        ]);
        $this->registerJs("
    
            $('.set-main').on('click',function(){
                $.get('" . \yii\helpers\Url::to(['/admin/portfolio/portfolio/set-main-image/']) . "', {id:$(this).attr('data-key')});
                
                });
    ");
        ?>

    </div></div>
<div>

'otherActionButtons' => '...';