Last updated on 19 Feb 2018
Yii2 – Modal Pop Up
Create ModalAssets.php in folder assets
<?php
namespace backend\assets;
use yii\web\AssetBundle;
/**
* Main backend application asset bundle.
*/
class ModalAsset extends AssetBundle {
public $basePath = '@webroot';
public $baseUrl = '@web';
public $css = [];
public $js = [
'js/modal.js',
];
public $depends = [
'yii\web\YiiAsset',
'yii\bootstrap\BootstrapPluginAsset',
'yii\jui\JuiAsset',
];
}
Create modal.js file in /root/web/js/modal.js
$(document).ready(function () {
$(document).on('click', '#modal-btn-pop-up', function (e) {
var url = $(this).attr("href");
$("#modalform").modal("show").find("#modalContent").load(url);
// $('.modal-title').text(" $this->title ");
e.preventDefault();
});
});
Put into after use namespacing
backend\assets\ModalAsset::register($this);
Put into end of code index.php
<?php Modal::begin([ 'size' => 'modal-lg', 'id' => 'modalform', 'options' => ['class' => 'modal fade'], 'header' => '<h4 class="text-center modal-title">' . $this->title . '</h4>', ]); ?> <div id="modalContent"></div> <?php Modal::end(); ?>
