使用 jquery-datatables 获取数据
Posted
技术标签:
【中文标题】使用 jquery-datatables 获取数据【英文标题】:Getting data using jquery-datatables 【发布时间】:2019-08-22 23:32:53 【问题描述】:我想从后端对数据进行分页,并且我想使用 jquery 数据表下载包含所有数据的 csv 表,但是由于它已经分页,所以 csv 只会返回第一页.. 有没有办法获取所有数据使用 jquery 数据表而不修改服务器端 url 或者我应该在不使用 jquery 数据表的情况下从后端完成所有工作和 csv 处理?
【问题讨论】:
您应该有另一个端点来导出 CSV,然后使用未分页的数据将所有对象返回给您。 【参考方案1】:你需要遵循这个: Server side Process
【讨论】:
【参考方案2】:<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="jquery-1.11.2.js"></script>
<link rel="stylesheet" type="text/css"
href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css" />
<script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js">
</script>
<script type="text/javascript">
$(document).ready(function ()
$.ajax(
url: 'EmployeeService.asmx/GetEmployees',
method: 'post',
dataType: 'json',
success: function (data)
$('#datatable').dataTable(
paging: true,
sort: true,
searching: true,
scrollY: 200,
data: data,
columns: [
'data': 'Id' ,
'data': 'FirstName' ,
'data': 'LastName' ,
'data': 'Gender' ,
'data': 'JobTitle' ,
'data': 'WebSite',
'sortable': false,
'searchable': false,
'render': function (webSite)
if (!webSite)
return 'N/A';
else
return '<a href=' + webSite + '>'
+ webSite.substr(0, 10) + '...' + '</a>';
,
'data': 'Salary',
'render': function (salary)
return "$" + salary;
,
'data': 'HireDate',
'render': function (jsonDate)
var date = new Date(parseInt(jsonDate.substr(6)));
var month = date.getMonth() + 1;
return month + "/" + date.getDate() + "/" + date.getFullYear();
]
);
);
);
</script>
</head>
<body style="font-family: Arial">
<form id="form1" runat="server">
<div style="width: 900px; border: 1px solid black; padding: 3px">
<table id="datatable">
<thead>
<tr>
<th>Id</th>
<th>First Name</th>
<th>Last Name</th>
<th>Gender</th>
<th>Job Title</th>
<th>Web Site</th>
<th>Salary</th>
<th>Hire Date</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Id</th>
<th>First Name</th>
<th>Last Name</th>
<th>Gender</th>
<th>Job Title</th>
<th>Web Site</th>
<th>Salary</th>
<th>Hire Date</th>
</tr>
</tfoot>
</table>
</div>
</form>
</body>
</html>
【讨论】:
以上是关于使用 jquery-datatables 获取数据的主要内容,如果未能解决你的问题,请参考以下文章