jQuery将多条数据插入模态框的示例代码


Posted in Javascript onSeptember 25, 2014
//Bootstrap模态框(局部)
<div class="modal fade" id="orderDetail">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
</div>

<div class="modal-body">
<table class="table">
<tr>



<td>名 称</td>



<td>原 价</td>





  </tr>
</table>
</div>

<div class="modal-footer">
</div>
</div>
</div>
/**
* 查看数据详情
* @黑眼诗人 <www.chenwei.ws>
*/
function orderDetail(order_no)
{
//1.先清空模态框数据
$('#orderDetail').find('tr').first().nextAll().remove();

//2.外部插入
var order_no = order_no;

$.post(base_url + '?d=admin&c=orders&m=ajax_order_detail', {order_no:order_no}, function(data){



 //数据的格式如: [{no:123,old:abc},{no:234,old:def},{no:345,old:ghi}]
var obj = eval('(' + data + ')');

$.each(obj, function(i, n){

var tr = $('#orderDetail').find('tr').last();

tr.after("<tr><td>"+ n['organize_name'] + ":" + n['cate_name'] + " -- " + n['course_name'] +"</td><td>"+ n['old_price'] +"</td><td>" + n['sale_price'] + "</td></tr>");
});
});
}
Javascript 相关文章推荐
jQuery中live方法的重复绑定说明
Oct 21 Javascript
jQuery代码优化 选择符篇
Nov 01 Javascript
js跑马灯代码(自写)
Apr 17 Javascript
javascript实现完美拖拽效果
May 06 Javascript
详解javascript传统方法实现异步校验
Jan 22 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
Jun 12 Javascript
vue插件tab选项卡使用小结
Oct 27 Javascript
整理关于Bootstrap模态弹出框的慕课笔记
Mar 29 Javascript
jQuery插件FusionCharts绘制的2D双柱状图效果示例【附demo源码】
May 13 jQuery
react+redux的升级版todoList的实现
Dec 18 Javascript
JS实现轮播图效果
Jan 11 Javascript
JS+JQuery实现无缝连接轮播图
Dec 30 jQuery
jQuery如何获取同一个类标签的所有值(默认无法获取)
Sep 25 #Javascript
jquery动态分页效果堪比时光网
Sep 25 #Javascript
浅析js预加载/延迟加载
Sep 25 #Javascript
深入了解Node.js中的一些特性
Sep 25 #Javascript
从JQuery源码分析JavaScript函数的apply方法与call方法
Sep 25 #Javascript
JS小游戏之仙剑翻牌源码详解
Sep 25 #Javascript
JS小游戏之宇宙战机源码详解
Sep 25 #Javascript
You might like
PHP面向对象的使用教程 简单数据库连接
2006/11/25 PHP
应用开发中涉及到的css和php笔记分享
2011/08/02 PHP
ThinkPHP连接数据库的方式汇总
2014/12/05 PHP
PHP7如何开启Opcode打造强悍性能详解
2018/05/11 PHP
JQuery 选择器 xpath 语法应用
2010/05/13 Javascript
使用JavaScript动态设置样式实现代码(2)
2013/01/25 Javascript
JS Loading功能的简单实现
2013/11/29 Javascript
简单方法判断JavaScript对象为null或者属性为空
2014/09/26 Javascript
JS实现随机乱撞彩色圆球特效的方法
2015/05/05 Javascript
JavaScript数组各种常见用法实例分析
2015/08/04 Javascript
jquery+css实现的红色线条横向二级菜单效果
2015/08/22 Javascript
JavaScript判断变量名是否存在数组中的实例
2017/12/28 Javascript
JS打印彩色菱形的实例代码
2018/08/15 Javascript
JavaScript学习教程之cookie与webstorage
2019/06/23 Javascript
vue 扩展现有组件的操作
2020/08/14 Javascript
微信小程序实现日历签到
2020/09/21 Javascript
Vue双向数据绑定(MVVM)的原理
2020/10/03 Javascript
[02:34]DOTA2英雄基础教程 幽鬼
2014/01/02 DOTA
在Python的Django框架中获取单个对象数据的简单方法
2015/07/17 Python
深入理解Python3中的http.client模块
2017/03/29 Python
pycharm 主题theme设置调整仿sublime的方法
2018/05/23 Python
python numpy和list查询其中某个数的个数及定位方法
2018/06/27 Python
解决PyCharm控制台输出乱码的问题
2019/01/16 Python
在Python中通过getattr获取对象引用的方法
2019/01/21 Python
python之当你发现QTimer不能用时的解决方法
2019/06/21 Python
python将字母转化为数字实例方法
2019/10/04 Python
HTML5 Canvas 破碎重组的视频特效的示例代码
2019/09/24 HTML / CSS
意大利综合购物网站:Giordano Shop
2016/10/21 全球购物
银行职业规划书范文
2013/12/28 职场文书
学生安全责任书模板
2014/07/25 职场文书
实习单位证明范例
2014/11/17 职场文书
导游词之云南省玉龙雪山
2019/12/19 职场文书
浅谈Golang 嵌套 interface 的赋值问题
2021/04/29 Golang
SQL Server中使用判断语句(IF ELSE/CASE WHEN )案例
2021/07/07 SQL Server
Python中递归以及递归遍历目录详解
2021/10/24 Python
Centos系统通过Docker安装并搭建MongoDB数据库
2022/04/12 MongoDB