文档章节

bootstrap中popover与ajax接合实现动态内容

webphp
 webphp
发布于 2017/07/26 11:28
字数 137
阅读 16
收藏 0
//html内容
<a href="javascript:void(0);" class="popover1" data-id="<?php echo $val->id;?>">查看联系人</a>
//js内容
$('[data-toggle="popover"]').popover();//初始化popover
    $(".popover1").popover({
        html: true,
        placement: 'left',
        title: '查看联系人',
        content: function(){
            var order_id  = $(this).data('id');
            var div_id =  "tmp-id-" + order_id;
            return details_in_popup(div_id, order_id);
        }
    })
    //ajax获取内容
    function details_in_popup(div_id, order_id){
        $.post(BASE_URL+'/admanager/index.php/order/getContacts/', {'order_id':order_id}, function(res){
            if ( res.status > 0 ) {
                var show_html = "<dl><dt>称呼:</dt>";
                    show_html += "<dd>"+ res.info.real_name+"</dd>";
                    show_html += "<dt>手机:</dt>";
                    show_html += "<dd>"+res.info.mobile+"</dd>";
                    show_html +="</dl>";
               $('#'+div_id).html(show_html);
            }else{
                $('#'+div_id).html("<p class='text-danger'>获取内容失败</p>");
            }
        })
        return '<div id="'+ div_id +'">Loading...</div>';
    }
 

© 著作权归作者所有

共有 人打赏支持
webphp
粉丝 1
博文 92
码字总数 92338
作品 0
海淀
程序员
基于bootstrap的检验组件--bt-validate

这是一个基于bootstrap的检验组件,改编自网络。 利用了bootstrap的popover弹出组件 显示出错信息,允许用户在表单组件中使用自定义规则。没有考虑 通过ajax方式 服务器返回的验证信息情况。...

yunhaifeiwu
2013/04/13
3.3K
0
【翻译】Flask大型教程|第二十章:加点JavaScript魔法

本文翻译自The Flask Mega-Tutorial Part XX: Some JavaScript Magic 这是Flask Mega-Tutorial系列的第二十部分,我将添加一个功能,当你将鼠标悬停在用户的昵称上时,会弹出一个漂亮的窗口。...

一进制
04/18
0
0
bootstrapx-popoverx

Popoverx 是Bootstrap Popover控件的增强版,Popoverx主要有如下增强: 提供onShown和onHidden回调,具有更友好的Ajax交互方式 提供单实例方式的Popover弹出框 智能处理显示位置,重新调整P...

史涛
2013/01/10
2.1K
0
响应式bootstrap管理员后台界面主题 - Charisma

Charisma是一套全功能的,免费,会员质量的响应式HTML5管理员界面模板,基于"Bootstrap",拥有了9套不同的主题颜色内容,可以满足你的不同需要! 在线演示 主要特性: 9套不同的主题 完全响应...

gbin1
2013/04/10
12.6K
17
扩展Bootstrap Tooltip插件使其可交互

最近在公司某项目开发中遇见一特殊需求,请笔者帮助,因此有了本文的插件。在前端开发中tooltip是一个极其常用的插件,它能更好向使用者展示更多的文档等帮助信息。它们通常都是一些静态文本...

zting科技
2017/01/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Ubuntu 安装ssh服务以及开启root用户ssh登录

一、安装ssh服务 安装ssh服务 sudo apt-get update sudo apt-get install openssh-server 安装完成后启动ssh服务 sudo service ssh start 二、开启root用户ssh登录 解决root远程ssh不能登录,...

15834278076
19分钟前
1
0
AndroidRX

1.延时并切换回主线程执行 Observable.just(true).delay(2, TimeUnit.SECONDS) .observeOn(AndroidSchedulers.mainThread()) .subscribe(new Consumer<Boolean>() { [@Override](https://my.......

我是菜鸟我骄傲
46分钟前
1
0
申请Let's Encrypt永久免费SSL证书

环境安装 1、安装git yum install git-core 2、安装python 系统自带 不用安装 只要版本大于2.7即可。 获取Let's Encrypt免费SSL证书 先停止nginx 在阿里云安全组里加入 443端口的入规则 git ...

HGMrWang
54分钟前
2
0
如何使用playframework进行更好的开发

1: 自定义基类Controller 相信刚开始使用Play的人写的Controller 都继承于 play.mvc.Controller , 但这并不是一个很好的选择,自建基类Controller可以扩展更多的功能。 1.1 验证功能。 后台...

tuerqidi
59分钟前
9
0
《JavaScript高级程序设计(第3版)》阅读笔记

第6章 面向对象的程序设计 6.2 创建对象 6.2.1 工厂模式 JavaScript创建对象(一)—— 工厂模式 6.2.2 构造函数模式 JavaScript创建对象(二)——构造函数模式 6.2.3 原型模式 JavaScript...

Bob2100
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部