ajax获取数据添加到表格,Jquery通过AJAX从后台获取数据显示在表格上(复选)
代码:
function GetMultiLineSelectTable(tableId, selectIds) {
var table = $(tableId);
var url = table.data('url');
var ischeckbox = false;
//获取数据项名称
var fileds = new Array();
table.children('thead').children('tr').children('th').each(function (index, el) {
var type = 'Content';
if ($(this).data('type')) type = $(this).data('type');
if (type == 'Content') {
var field = $(this).data('field');
fileds[index] = field;
}
else if (type == 'CheckBox') {
ischeckbox = true;
}
});
$.ajax({
url: url,
type: 'post',
dataType: 'json',
})
.done(function (json) {
//向表格内新增内容
var tbody = '';
$.each(json, function (index, el) {
var tr = "
";
if (ischeckbox) {//生成复选按钮
//tr+='
'
tr += '
'
}
$.each(fileds, function (i, el) {//生成内容
if (fileds[i]) {
tr += '
' + formatJsonData(json[index][fileds[i]]) + '';
}
});
tr += "
";
tbody += tr;
});
table.children('tbody').empty();
table.children('tbody').append(tbody);//显示数据
if (selectIds) {//将需要选中的行设为选中状态
selectIds.each(function (index, el) {
//建设中
});
}
table.children('tbody').addClass('sel');
table.children('tbody.sel').children('tr').click(function (event) {//点击行事件
$(this).toggleClass('active');//增加选中效果
if (ischeckbox) $(this).find('input[type="checkbox"]').attr('checked', $(this).hasClass('active'));//选择复选框
});
}).fail(function () {
alert("Err");
});
}
//格式化JSON数据,比如日期
function formatJsonData(jsondata){
if(jsondata==null){
return '';
}
else if(/\/Date\(\d+\)/.exec(jsondata)){
var date = new Date(parseInt(jsondata.replace("/Date(", "").replace(")/", ""), 10));
return date.toLocaleString();
}
return jsondata;
}
用法:
ID名称简介
jQuery(document).ready(function ($) {
GetMultiLineSelectTable("#GroupTable");
});
代表需要显示复选框,不想要复选框直接删掉就行了
获取选中的行ID:
function GetGroupTableSelectIds(){
var selects=$('#GroupTable').children('tbody').children('tr.active');
var ids=new Array();
selects.each(function(index, el) {
ids[index]=el.cells[1].innerHTML;
});
return ids;
}
jquery通过AJAX从后台获取信息并显示在表格上的类
前一阵我写了:现在,我把他们处理了一下,不需要每次写代码了: 具体代码如下: //获取数据并显示数据表格 funct ...
jquery通过AJAX从后台获取信息并显示在表格上,并支持行选中
不想用Easyui的样式,但是想要他的表格功能,本来一开始是要到网上找相关插件的,但是没找到就开始自己写,没想到这么简单. 后台代码:(这个不重要) public ActionResult GetDi ...
jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法
jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...
jquery如何通过ajax请求获取后台数据显示在表格上
1.引入bootstrap和jquery的cdn
javascript代码: $(document).ready(function ($) { ...
ajax获取数据添加到表格,Jquery通过AJAX从后台获取数据显示在表格上(复选)相关推荐
- 利用jquery写的从后台获取json数据以表格显示,并带翻页功能.里面包含模式窗口等功能...
利用jquery写的从后台获取json数据,以表格显示,并带翻页功能 里面包含模式窗口等功能 大家看例子就懂了 下面是效果图: http://www.jm47.com/project/3001.asp ...
- html弹窗显示表格,js弹框表格,获取数据添加进去dom里面
js操作DOM是否是你想要的结构?我的问题与你类似,只不过是建立在动态表上 /** 功能实现:1.实现表格添加一行 2.实现表格删除当前行 步骤:1.根据表格id获取当前表格 2.获取表格中的tBod ...
- ajax 请求成功 再执行javascript,jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法...
jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...
- ajax 获取用户ip地址,利用jQuery实现Ajax获取当前IP地区位置代码
特效描述:利用jQuery实现 Ajax 获取当前IP 地区位置代码.利用jQuery实现Ajax获取当前IP和地区位置代码 代码结构 1. 引入JS 2. HTML代码 AJAX检测ip和地区 $( ...
- 用ajax修改成功怎么返回页面,jquery操作ajax返回的页面元素
这两天工作不忙,正好从朋友那里拿到一个某个应用的开发文档,相关数据放在了mongodb里,自己电脑可以本地开启服务器然后通过给的借口来获取数据.由于这是一个比较大比较全的一个完整项目,也没有那么多经历 ...
- asp.net ajax删除数据,Asp.net MVC 2 使用Ajax删除数据
一.新建一个Asp.net MVC 2 Empty Web Application. 二.添加一个名叫DataClasses1.dbml的Model,拖放Student表,最后如下图所示. 三.添加一 ...
- 如何在js中使用ajax请求数据,在 JS 中怎么使用 Ajax 来进行请求
在 JS 中怎么使用 Ajax 来进行请求 发布时间:2021-07-22 09:48:43 来源:亿速云 阅读:78 作者:chen 本篇内容介绍了"在 JS 中怎么使用 Ajax 来进行 ...
- 如何在js中使用ajax请求数据,在 JS 中如何使用 Ajax 来进行请求
做者:Danny Markov 译者:前端小智 来源:tutorialzine 点赞再看,微信搜索 [大迁世界]关注这个没有大厂背景,但有着一股向上积极心态人.本文 GitHub https://gi ...
- 从别的网站服务器获取数据,使用get()方法以GET方式从服务器获取数据
使用get()方法以GET方式从服务器获取数据 我的个人资料 $(function () { $("#btnShow").bind("click", funct ...
最新文章
- this、new、apply和call详解
- 编译原理 python_Python局部变量编译原理
- SAP Engagement Center的ShellCarousel控件control
- 【洛谷P4707】重返现世【扩展Min-Max容斥】【dp】
- opencv 在debian6.0下安装
- 【转】NHibernate集合映射中的set, list, map, bag, array
- 浅析人工智能自然语言生成定义
- 解决连接本地oracle无监听的问题
- poj 3190(贪心)
- matlab液压仿真模型,基于MATLABsimulink的液压系统动态仿真.ppt
- Hive实现同比环比计算
- android 水波纹进度,Android自定义View-水波纹progressbar
- 斯巴达300勇士 中英文对照
- Filament加载并渲染glTF模型
- jQuery 基础 筛选和遍历 jQuery 对象
- 多重循环(图形打印2)-C语言
- java编辑遗忘曲线代码_通过excel vba 实现艾宾浩斯遗忘曲线的复习提醒
- 山寨手机软件测试工程师,安卓手机跑分作弊方法公布,仅供学习交流 Chainfire3D...
- python手游服务端搭建
- git detached HEAD 问题处理