文档章节

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
码字总数 92070
作品 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

没有更多内容

加载失败,请刷新页面

加载更多

下一页

(三)Nginx配置·续

概述 前文写了关于Nginx环境配置,但是还没有完,接下来将会继续讲三个相关的配置 主要是以下三个 1.Nginx访问日志 2.Nginx日志切割 3.静态文件不记录日志和过期时间 Nginx访问日志 1.先看看...

杉下
今天
1
0
jquery创建类似于java的map

var map = {}; // Map map = new HashMap(); map[key] = value; // map.put(key, value); var value = map[key]; // Object value = map.get(key); var has = key in map; // boolean has = ......

SuperDabai
今天
0
0
java大数据转换16进制转10进制

public static void main(String[] args) {String hex = "0xdbf3accc683297cf0000";BigInteger amount = new BigInteger(hex.substring(2), 16);System.out.println(amount);......

任梁荣
昨天
2
0
OSChina 周六乱弹 —— 目测我们程序员丁克的几率不大

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @真Skr小机灵鬼儿:8.13分享Jocelyn Pook/Russian Red的单曲《Loving Strangers》 《Loving Strangers》- Jocelyn Pook/Russian Red 手机党少...

小小编辑
昨天
14
4
TypeScript基础入门 - 函数 - 剩余参数

转载 TypeScript基础入门 - 函数 - 剩余参数 项目实践仓库 https://github.com/durban89/typescript_demo.gittag: 1.2.1 为了保证后面的学习演示需要安装下ts-node,这样后面的每个操作都能...

durban
昨天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部