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 学习第六课 实现一个Ajax的TreeView
May 17 Javascript
javascript克隆对象深度介绍
Nov 20 Javascript
jquery模拟SELECT下拉框取值效果
Oct 23 Javascript
js抽奖实现随机抽奖代码效果
Dec 02 Javascript
javascript运算符——位运算符全面介绍
Jul 14 Javascript
jquery siblings获取同辈元素用法实例分析
Jul 25 Javascript
详解Vue用axios发送post请求自动set cookie
May 10 Javascript
浅谈vue,angular,react数据双向绑定原理分析
Nov 28 Javascript
通过vue写一个瀑布流插件代码实例
Sep 07 Javascript
基于layui table返回的值的多级嵌套的解决方法
Sep 19 Javascript
2分钟实现一个Vue实时直播系统的示例代码
Jun 05 Javascript
vue组件讲解(is属性的用法)模板标签替换操作
Sep 04 Javascript
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
第二节 对象模型 [2]
2006/10/09 PHP
第1次亲密接触PHP5(2)
2006/10/09 PHP
php生成缩略图填充白边(等比缩略图方案)
2013/12/25 PHP
php的declare控制符和ticks教程(附示例)
2014/03/21 PHP
php数组添加元素方法小结
2014/12/20 PHP
CodeIgniter读写分离实现方法详解
2016/01/20 PHP
提高Laravel应用性能方法详解
2019/06/24 PHP
利用javascript中的call实现继承
2007/01/22 Javascript
javascript不同页面传值的改进版
2008/09/30 Javascript
常见效果实现之返回顶部(结合淡入、淡出、减速滚动)
2012/01/04 Javascript
类似php的js数组的in_array函数自定义方法
2013/12/27 Javascript
控制input输入框中提示信息的显示和隐藏的方法
2014/02/12 Javascript
ajaxFileUpload.js插件支持多文件上传的方法
2014/09/02 Javascript
nw.js实现类似微信的聊天软件
2015/03/16 Javascript
javascript给span标签赋值的方法
2015/11/26 Javascript
jquery ajax分页插件的简单实现
2016/01/27 Javascript
AngularJS实现与Java Web服务器交互操作示例【附demo源码下载】
2016/11/02 Javascript
javascript常用经典算法详解
2017/01/11 Javascript
nodeJs爬虫的技术点总结
2018/05/13 NodeJs
[49:20]2014 DOTA2国际邀请赛中国区预选赛5.21 CIS VS TongFu
2014/05/22 DOTA
Python匹配中文的正则表达式
2016/05/11 Python
Python实现拷贝多个文件到同一目录的方法
2016/09/19 Python
python利用dir函数查看类中所有成员函数示例代码
2017/09/08 Python
Python2.7环境Flask框架安装简明教程【已测试】
2018/07/13 Python
python定时复制远程文件夹中所有文件
2019/04/30 Python
利用pyecharts实现地图可视化的例子
2019/08/12 Python
Python面向对象之Web静态服务器
2019/09/03 Python
pyspark 随机森林的实现
2020/04/24 Python
Python实现JS解密并爬取某音漫客网站
2020/10/23 Python
HTML5中FileReader接口使用方法实例详解
2017/08/26 HTML / CSS
社团活动总结报告
2014/06/27 职场文书
汽车检测与维修专业求职信
2014/07/04 职场文书
2014年行政助理工作总结
2014/11/19 职场文书
2014年帮扶工作总结
2014/11/26 职场文书
大学生自我鉴定怎么写
2019/05/07 职场文书
Python爬虫爬取全球疫情数据并存储到mysql数据库的步骤
2021/03/29 Python