思路:

点击删除按钮,通过jquery将删除操作的URL赋值到页面URL元素,并弹出会话框

用户点击确认,通过jquery获取URL,并发送删除请求至后台。

一、删除button

<a class="btn btn-primary" onClick="delcfm('${ctxPath}/manager/project/delete?id=${vo.id?default("")}')">删除</a>

二、js定义


  1. function delcfm(url) {
  2. $('#url').val(url);//给会话中的隐藏属性URL赋值
  3. $('#delcfmModel').modal();
  4. }
  5. function urlSubmit(){
  6.    var url=$.trim($("#url").val());//获取会话中的隐藏属性URL
  7.    window.location.href=url;  
  8. }

一、定义dialog会话框


  1. <!-- 信息删除确认 -->
  2. <div class="modal fade" id="delcfmModel">
  3. <div class="modal-dialog">
  4. <div class="modal-content message_align">
  5. <div class="modal-header">
  6. <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
  7. <h4 class="modal-title">提示信息</h4>
  8. </div>
  9. <div class="modal-body">
  10. <p>您确认要删除吗?</p>
  11. </div>
  12. <div class="modal-footer">
  13. <input type="hidden" id="url"/>
  14. <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
  15. <a onclick="urlSubmit()" class="btn btn-success" data-dismiss="modal">确定</a>
  16. </div>
  17. </div><!-- /.modal-content -->
  18. </div><!-- /.modal-dialog -->
  19. </div><!-- /.modal -->

jQuery 实现 bootstrap 模态框 删除确认的更多相关文章

  1. jquery 修改 bootstrap模态框的宽度并且居中

    1.定义模态框 <div class="modal fade" id="Project_Cell_Modal" tabindex="-1&quo ...

  2. 7-20 jquery遍历节点,bootstrap模态框绑定事件和解绑,mock.js,model.urlroot,id,打基础

    7-19 1:$(event.target).parents().filter("tr").find("host-name") 为什么选择不到别的host-na ...

  3. 去除bootstrap模态框半透明阴影

    当使用bootstrap模态框默认自带半透明阴影,如果想要去除阴影,需要怎么做呢? 今天在项目中我遇到了这个问题,想要去除模态框的阴影,试了好久都没解决.后来问同事的时候才知道,当模态框弹出后,会加上 ...

  4. 前端之bootstrap模态框

    简介:模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. Modal简介 Modal实现弹出表单 M ...

  5. bootstrap模态框传值操作

    1.bootstrap模态框之html代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"& ...

  6. Bootstrap, 模态框实现值传递,自动勾选

    目录 Bootstrap,模态框自动勾选,值传递 1.父页面 2. 子页面(modal) 模态框 Bootstrap,模态框自动勾选,值传递 场景: ​ 有一个这样的需求, 在父页面有一个table, ...

  7. Bootstrap 模态框(Modal)插件

    原文链接:http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html Bootstrap 模态框(Modal)插件 模态框(Modal)是覆 ...

  8. Bootstrap模态框(MVC)

    BZ这篇博客主要是为大家介绍一下MVC如何弹出模态框.本文如果有什么不对的地方,希望大神们多多指教,也希望和我一样的小菜多多学习.BZ在这里谢过各位. 首先要在页面加上一个点击事件: @Html.Ac ...

  9. bootstrap模态框modal使用remote第二次加载显示相同内容解决办法

    bootstrap模态框modal使用remote动态加载内容,第二次加载显示相同内容解决办法 bootstrap的modal中,使用remote可以动态加载页面到modal-body中,并弹窗显示 ...

随机推荐

  1. stl源码剖析 详细学习笔记deque(1)

    //--------------------------15/3/12---------------------------- deque { deque没有容量(capacity)观念,是动态分段的 ...

  2. Spring学习(十九)----- Spring与WEB容器整合

    首先可以肯定的是,加载顺序与它们在 web.xml 文件中的先后顺序无关.即不会因为 filter 写在 listener 的前面而会先加载 filter.最终得出的结论是:listener -> ...

  3. docker之容器管理

    一.docker常用的创建命令 [root@node03 ~]# docker create --help [root@node03 ~]# docker run --help OPTIONS说明: ...

  4. Go语言简单学习

    GO 支持goroutine 和通道,并且推荐使用消息而不是共享内存来进行并发编程,总体来说,Go语言是一个非常现代化的语言,精小但非常强大 Go语言的主要特性: 1.自动垃圾回收 2.更丰富的内置类 ...

  5. 理解以太坊的Layer 2扩容解决方案:状态通道(State Channels)、Plasma 和 Truebit

    -宾夕法尼亚州的尼科尔森大桥建设照片(图源).罗马人的工程原理扩展至新的应用 对于以太坊来说,2018年是专注底层架构之年.今年很多早期参与者会测试网络极限,并且重新关注以太坊的扩容技术. 以太坊仍然 ...

  6. PHP Laravel 连接并访问数据库

    第一次连接数据库 数据库配置位于config/database.php数据库用户名及密码等敏感信息位于.env文件创建一个测试表laravel_course <?php namespace Ap ...

  7. Backbone.js源码浅介

    终于看到一个只有一千多行的js框架了,于是抱着一定可以看懂他的逻辑的心态,查看了他的整个源码,进去之后才发现看明白怎么用容易,看懂怎么写的就难了,于是乎有了这篇博客的标题:浅介,只能粗浅的介绍下Bac ...

  8. Notes of Daily Scrum Meeting(11.12)

    今天我们召开了Beta阶段MOOC项目开发的第一次Scrum Meeting,在会上就alpha阶段进行了总结,然后我们确定了 接下来的Beta阶段的项目分工,并且就每天的进度汇报做了一个约定,就是每 ...

  9. 『编程题全队』Alpha 阶段冲刺博客Day7

    1.每日站立式会议 1.会议照片 2.昨天已完成的工作统计 孙志威: 1.添加了网络通信管理类 2.稍微修改了燃尽图模块ChartWidget 3.在主窗口中添加了用户信息框 4.重构了项目中的文件结 ...

  10. 虚拟主机修改上传配置(PHP)

    虚拟主机中不允许修改php.ini 配置文件(当然有的允许修改,则修改php.ini,因为有时候在线上通过.htaccess 修改了也没有作用),只能通过ini_set() 或重写文件.htacces ...