Gridview Yii2在单击图像时弹出的窗口中显示图像
我有一个gridview，显示保存到mysql中的图像的缩略图。我需要在单击时将图像显示为弹出窗口 这是我在index.php中的gridview视图 这是代码[更新]Gridview Yii2在单击图像时弹出的窗口中显示图像,gridview,yii2,popup,Gridview,Yii2,Popup,我有一个gridview，显示保存到mysql中的图像的缩略图。我需要在单击时将图像显示为弹出窗口 这是我在index.php中的gridview视图 这是代码[更新] <?php <div class="license-index"> <h1><?= Html::encode($this->title) ?></h1> <?php // echo $this->render('_search', ['model' =&
<?php
<div class="license-index">
<h1><?= Html::encode($this->title) ?></h1>
<?php // echo $this->render('_search', ['model' => $searchModel]); ?>
<p>
<?= Html::a('Create License', ['create'], ['class' => 'btn btn-success']) ?>
</p>
<?=
GridView::widget([
'filterModel' => $searchModel,
'dataProvider' => $dataProvider,
'pjax' => true,
'pjaxSettings' => [
'neverTimeout' => true,
'options' => [
'id' => '-pjax',
'enableReplaceState' => false,
'enablePushState' => false,
],
],
'columns' => [
['class' => 'yii\grid\SerialColumn',
'header' => 'No',
'options' => [
'width' => '10px',
],
],
'company',
'address',
[
'attribute' => 'bukti',
'value' => function ($data) {
return Html::a(Html::img(Yii::getAlias('@web') . '/file/' . $data->bukti, ['alt' => 'some', 'class' => 'fancy-box', 'height' => '100px', 'width' => '100px']), ['site/zoom']);
},
'format' => ['raw'],
],
['class' => 'yii\grid\ActionColumn'],
],
]);
?>
</div>
<?php
$this->registerJs('jQuery(document).ready(function(){
jQuery("a.fancy-box").fancybox();
});');
?>
您可以像这样使用jQuery插件：
安装起来很容易（）
添加插件的资源
<link rel="stylesheet" href="magnific-popup/magnific-popup.css">
<script src="magnific-popup/jquery.magnific-popup.js"></script>
希望这会有帮助 您可以像这样使用jQuery插件：
安装起来很容易（）
添加插件的资源
<link rel="stylesheet" href="magnific-popup/magnific-popup.css">
<script src="magnific-popup/jquery.magnific-popup.js"></script>
希望这会有帮助 您可以简单地使用任何模式框插件（例如，）并按类名初始化
$this->registerJsFile('modalJs');
$this->registerCssFile('modalCss')
[
'attribute' => 'bukti',
'value' => function ($data) {
return Html::a(Html::img(Yii::getAlias('@web') . '/file/' . $data->bukti, ['alt' => 'some', 'class' => 'fancy-box', 'height' => '100px', 'width' => '100px']), ['site/zoom']);
},
'format' => ['raw'],
]
$this->registerJs('jQuery(document).ready(function(){
jQuery("a.fancy-box").fancybox();
});')
您可以简单地使用任何模式框插件（例如）并按类名初始化
$this->registerJsFile('modalJs');
$this->registerCssFile('modalCss')
[
'attribute' => 'bukti',
'value' => function ($data) {
return Html::a(Html::img(Yii::getAlias('@web') . '/file/' . $data->bukti, ['alt' => 'some', 'class' => 'fancy-box', 'height' => '100px', 'width' => '100px']), ['site/zoom']);
},
'format' => ['raw'],
]
$this->registerJs('jQuery(document).ready(function(){
jQuery("a.fancy-box").fancybox();
});')
它不起作用。我希望你能看看我的全部代码。我已经更新了代码。感谢您需要在文件$this->registerCssFile（'）的开头注册Js和css资源$此->注册表文件（'）；它不起作用。我希望你能看看我的全部代码。我已经更新了代码。感谢您需要在文件$this->registerCssFile（'）的开头注册Js和css资源$此->注册表文件（'）；它不起作用。无法加载图像。