我想在yii2-fileinput-widget中有更多按钮。
我目前的代码是这样的:
$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,
]
]);
现在我需要在删除按钮附近添加一个按钮,将一些数据发送到服务器并将所选图片设置为封面或更改数据库中的图片状态。
我该怎么做?
答案 0 :(得分:1)
试试这个:
$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'=&gt; '...';