模态框（Modal）

简介

yii2中modal的使用也是较为频繁的，而且在很大程度上能提升网站的用户体验，那么我们就不得不介绍一下yii2自带的bootstrap组件Modal是如何使用的。

演示

通过点击按钮

弹出模态框

用法

引入模态框（modal）组件,就是在页面中引入一个模态框

<?php
use yii\bootstrap\Modal;

Modal::begin([
    'id' => 'page-modal',
    'header' => '<h5>这里是标题</h5>',
    'toggleButton' => ['label' => 'click me'],
]);

echo '这里是模态内容...';

Modal::end();
?>

添加触发模态框（Modal）的按钮

<?= Html::a('点击按钮', '#', [
     'class' => 'btn btn-success',
     'data-toggle' => 'modal', 
     'data-target' => '#page-modal'    //此处对应Modal组件中设置的id
     ]) 
 ?>

参数设置：https://github.com/yiisoft/yii2-bootstrap/blob/master/Modal.php