yii2.0 模态框简单使用
1 <?php foreach($data as $model) :?>
2
3 <!-- 按钮触发模态框 -->
4 <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal<?=$model->id;?>">
5
6 点击按钮显示模态框
7 </button>
8 <!-- 模态框(Modal) -->
9 <div class="modal fade" id="myModal<?=$model->id;?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
10 <div class="modal-dialog" style="width:600px"><!-- 设置宽度-->
11 <div class="modal-content">
12 <div class="modal-header">
13 <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> x </button>
14 <h4 class="modal-title" id="myModalLabel"> 预览 </h4>
15 </div>
16 <div class="modal-body">
17 在这里添加一些文本
18 </div>
19 <div class="modal-footer">
20 <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
21 </div>
22 </div><!-- /.modal-content -->
23 </div><!-- /.modal -->
24 </div>
25
26 <?php endforeach;?>
yii2.0 模态框简单使用的更多相关文章
- Bootstrap(v3.2.0)模态框(modal)垂直居中
Bootstrap(v3.2.0)模态框(modal)垂直居中方法: 在bootstrap.js文件900行后面添加如下代码,便可以实现垂直居中. that.$element.children().e ...
- JS模态框 简单案例
演示: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8 ...
- bootstrap3.0 模态框显示的文字超出怎么办
版本:bootstrap3.3 模态框文字超出 解决方案: 在html中控制自动换行 其实只要在表格控制中添加一句<div style="word-break:break-all& ...
- [YII2.0] 高级模板简单安装教程
YIICHINA官网教程就很完善:http://www.yiichina.com/tutorial/692 但是在yii2框架安装运行init.bat报错php.exe不是内部或外部命令, 解决办法: ...
- [moka同学笔记]yii2.0 dropdownlist的简单使用(一)
1.controller控制中 $modelCountrytelCode = CountryTelCode::find()->orderBy('id DESC')->all(); $tel ...
- yii2.0场景的简单使用
一.规则中使用场景规则场景的使用模型层public function rules(){ return [ [['name','product_id'],'required','on'=>'add ...
- bootstrap模态框传值操作
1.bootstrap模态框之html代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"& ...
- JavaScript:bootstrap 模态框的简单应用
最近用上了bootstrap这个强大的前端框架,有空来总结一下.这里记录下模态框的简单应用. 首先,要在页面中引入相应的js.css文件 <link href="css/bootstr ...
- Bootstrap3.0学习教程十七:JavaScript插件模态框
这篇文章中我们主要来学习一下JavaScipt插件模态框.在学习模态框之前,我们先来了解一下JavaScript插件吧. JavaScript插件概览 插件可以单个引入(使用Bootstrap提供的单 ...
随机推荐
- spring与缓存注解,以及encache缓存使用
随着时间的积累,应用的使用用户不断增加,数据规模也越来越大,往往数据库查询操作会成为影响用户使用体验的瓶颈,此时使用缓存往往是解决这一问题非常好的手段之一.Spring 3开始提供了强大的基于注解的缓 ...
- Kitty基于Spring Boot、Spring Cloud、Vue.js、Element实现前后端分离的权限管理系统
源码地址:https://gitee.com/liuge1988/kitty 软件架构 后端架构 开发环境 IDE : eclipse 4.x JDK : JDK1.8.x Maven : Maven ...
- Git系列:常用命令
一.背景 作为一名程序员,怎么能不懂Git那些常用命令呢?于是花费一点时间来总结Git命令.关于安装的话,就不讲了. 二.常用命令 1.配置全局的用户名称和用户邮箱 git config --glob ...
- sqlsugar入门(3)-DateTime.ToString("yyyy-MM-dd HH:mm:ss.fff")源码修改
1.注释SqlSugar\ExpressionsToSql\ResolveItems\MethodCallExpressionResolve文件下的GetMethodValue方法 case &quo ...
- java常用类——包装类
八种基本数据类型对应八种包装类和它们的继承关系 基本数据类型 对应的包装类 boolean Boolean byte Byte short Short int Integer long Long ch ...
- Spark: JAVA_HOME is not set
在Spark项目,sbin目录下的spark-config.sh文件下,最后添加JAVA_HOME的索引. 即可.
- Python列表lists索引关于字符串小纪
看的出'字符串列表'中的空格也是计算在内的
- 你说一下对Java中的volatile的理解吧
前言 volatile相关的知识其实自己一直都是有掌握的,能大概讲出一些知识,例如:它可以保证可见性:禁止指令重排.这两个特性张口就来,但要再往深了问,具体是如何实现这两个特性的,以及在什么场景下使用 ...
- 【SpringBoot】10.SpringBoot文件上传
SpringBoot整合Thymeleaf 1.创建Thymeleaf的入门项目 maven构建简单项目 修改pom文件添加thymeleaf的坐标 <!-- thymeleaf的坐标 --&g ...
- js练习题之查找数组中的位子
输出描述: 如果数组中存在 item,则返回元素在数组中的位置,否则返回 -1 输入例子: indexOf([ 1, 2, 3, 4 ], 3) 输出例子: 2 function indexOf(ar ...