我正在尝试实现功能,通过单击屏幕上的按钮将导致我的jQuery dataTable刷新(因为自创建dataTable以来服务器端数据源可能已更改).
这就是我所拥有的:
$(document).ready(function() {
$("#my-button").click(function() {
$("#my-datatable").dataTable().fnReloadAjax();
});
});
Run Code Online (Sandbox Code Playgroud)
但是当我运行它时,它什么也没做.单击按钮时刷新dataTable的正确方法是什么?提前致谢!
只有在输入3个字符后才能选择开始搜索吗?
我已经为显示20,000个条目的同事编写了一个PHP脚本,他们抱怨说,在输入单词时,前几个字母会导致所有内容冻结.
另一种方法是通过单击按钮而不是通过字符输入来启动搜索.
以下是我目前的代码:
$("#my_table").dataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bAutoWidth": false,
"aoColumns": [
/* qdatetime */ { "bSearchable": false },
/* id */ null,
/* name */ null,
/* category */ null,
/* appsversion */ null,
/* osversion */ null,
/* details */ { "bVisible": false },
/* devinfo */ { "bVisible": false, "bSortable": false }
],
"oLanguage": {
"sProcessing": "Wait please...",
"sZeroRecords": "No ids found.",
"sInfo": "Ids from _START_ to _END_ of _TOTAL_ total",
"sInfoEmpty": "Ids from 0 …
Run Code Online (Sandbox Code Playgroud) 我在项目中使用jQuery DataTables,我想知道如何禁用最后一列的排序.我想在整个网站上实施.
现在我有以下代码:
<!-- jQuery DataTable -->
<script src="../assets/js/plugins/dataTables/jquery.datatables.min.js"></script>
<script>
/* Default class modification */
$.extend( $.fn.dataTableExt.oStdClasses, {
"sWrapper": "dataTables_wrapper form-inline"
} );
/* API method to get paging information */
$.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings )
{
return {
"iStart": oSettings._iDisplayStart,
"iEnd": oSettings.fnDisplayEnd(),
"iLength": oSettings._iDisplayLength,
"iTotal": oSettings.fnRecordsTotal(),
"iFilteredTotal": oSettings.fnRecordsDisplay(),
"iPage": Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ),
"iTotalPages": Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength )
};
}
/* Bootstrap style pagination control */
$.extend( $.fn.dataTableExt.oPagination, {
"bootstrap": {
"fnInit": function( oSettings, nPaging, fnDraw …
Run Code Online (Sandbox Code Playgroud) 假设我有时从服务器获取空数据,我想在DataTables中显示No Data found消息?这怎么可能?
我正在使用jQuery DataTables,我想知道是否可以在表的第一列禁用自动排序?
我的代码看起来像这样:
/* Default class modification */
$.extend( $.fn.dataTableExt.oStdClasses, {
"sWrapper": "dataTables_wrapper form-inline"
} );
/* API method to get paging information */
$.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings )
{
return {
"iStart": oSettings._iDisplayStart,
"iEnd": oSettings.fnDisplayEnd(),
"iLength": oSettings._iDisplayLength,
"iTotal": oSettings.fnRecordsTotal(),
"iFilteredTotal": oSettings.fnRecordsDisplay(),
"iPage": Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ),
"iTotalPages": Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength )
};
}
/* Bootstrap style pagination control */
$.extend( $.fn.dataTableExt.oPagination, {
"bootstrap": {
"fnInit": function( oSettings, nPaging, fnDraw ) {
var oLang = oSettings.oLanguage.oPaginate;
var …
Run Code Online (Sandbox Code Playgroud) 我正试图通过此链接使用jQuery的Datatable JS来处理我的项目.
我从同一个源下载了完整的库.包中给出的所有示例似乎都运行正常,但是当我尝试将它们合并到我WebForms
的CSS中时,JS根本不起作用.
这是我做的:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<table id="myTable" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
<tbody>
<!-- table body -->
</tbody>
</table>
</div>
<script src="js/jquery.dataTables.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#myTable').DataTable();
});
</script>
</form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我的解决方案中JS和CSS的文件结构如下所示:
我已经添加了所有必要的JS和CSS引用,如手册中所示.渲染仍然不如预期.没有CSS,甚至JS都不起作用.
同样在控制台中我收到以下错误: …
有没有办法用jquery datatables插件隐藏(和显示)表列?
我想出了如何重新加载表数据:使用fnClearTable
和fnAddData
.
但我的问题是,在我对表的一个视图中(例如隐藏模式)我不想显示某些列.
我理解这是一个受欢迎的问题,我已经在Stack Overflow和其他网站(包括datatables网站)上阅读了所有类似的问题.
为了澄清,我正在使用
我还确保我正确地收到了JSON数组:
[{"name_en":"hello","phone":"55555555"},{"name_en":"hi","phone":"00000000"}]
Run Code Online (Sandbox Code Playgroud)
我的HTML表格如下所示:
<table id="customer_table">
<thead>
<tr>
<th>Name</th>
<th>Phone</th>
</tr>
</thead>
</table>
Run Code Online (Sandbox Code Playgroud)
这是我的document.ready
功能:
$(document).ready(function(){
//$('#customer_table').DataTable();
$('#customer_table').DataTable( {
"ajax": 'json',
"dataSrc": "",
"columns": [
{ "data": "email" },
{ "data": "name_en" }
]
});
});
Run Code Online (Sandbox Code Playgroud)
我得到的错误是
未捕获的TypeError:无法读取未定义的属性"长度"
我正在使用jQuery数据表.运行应用程序时,标题宽度与主体宽度不对齐.但是当我点击标题时,它会与身体宽度对齐,但即便如此,也会出现一些轻微的错位.此问题仅在IE中出现.
这是页面加载时的样子:
点击标题后:
我的数据表代码:
$("#rates").dataTable({
"bPaginate": false,
"sScrollY": "250px",
"bAutoWidth": false,
"bScrollCollapse": true,
"bLengthChange": false,
"bFilter": false,
"sDom": '<"top">rt<"bottom"flp><"clear">',
"aoColumns": [{
"bSortable": false
},
null,
null,
null,
null
]
});
Run Code Online (Sandbox Code Playgroud)
rates
是我的表id.
任何人都可以帮我这个吗?提前致谢.
datatables ×10
jquery ×10
javascript ×4
json ×2
alignment ×1
asp.net ×1
asp.net-mvc ×1
codeigniter ×1
css ×1
date-sorting ×1
html-table ×1
sorting ×1