标签: jquery-datatables
从Jquery数据表中隐藏LengthMenu
请问如何从我的Jquery数据表中隐藏LengthMenu(显示每页显示的记录数的下拉列表)？
目前我可以禁用它,但我不希望它出现.请看 下面的小提琴: -
testdata = [{"id":"58","country_code":"UK"},{"id":"59","country_code":"US"}];
$('#test').dataTable({
"aaData": testdata,
"aoColumns": [
{ "mDataProp": "id" },
{ "mDataProp": "country_code" }
],
"bLengthMenu" : false, //thought this line could hide the LengthMenu
"bInfo":false,
});
`//the next 2 lines disables the LengthMenu
//var aLengthMenu = $('select[name=test_length]');
//$(aLengthMenu).prop('display', 'disabled');
推荐指数
解决办法
查看次数
模型绑定新的Datatables 1.10参数
在Datatables 1.10中,ajax服务器端参数已更改
public class DataTableParamModel
{
public string sEcho{ get; set; }
public string sSearch{ get; set; }
public int iDisplayLength{ get; set; }
public int iDisplayStart{ get; set; }
public int iColumns{ get; set; }
public int iSortingCols{ get; set; }
public string sColumns{ get; set; }
}
to(API Here http://datatables.net/manual/server-side)
columns[i][data]
columns[i][name]
columns[i][orderable]
columns[i][search][regex]
columns[i][search][value]
columns[i][searchable]
...
draw
length
order[i][column]
order[i][dir]
...
search[regex]
search[value]
start
有些很容易绑定
public class DataTableParamModel
{
public string draw { get; set; } …推荐指数
解决办法
查看次数
jQuery DataTables仅过滤特定列
我使用jQuery插件DataTables(http://datatables.net)进行分页,搜索功能和过滤.
有一个过滤函数(http://datatables.net/release-datatables/examples/api/multi_filter_select.html),它为每列放置表单选择元素.
我的问题是我不希望每列的过滤器选择元素,只有一些.我修改了原始代码,因为我想要是/否过滤,我的第一列包含用户名.
如何从第一列中删除表单选择元素？
JavaScript的:
<script type="text/javascript">
$(document).ready(function() {
(function($) {
/*
* Function: fnGetColumnData
* Purpose: Return an array of table values from a particular column.
* Returns: array string: 1d data array
* Inputs: object:oSettings - dataTable settings object. This is always the last argument past to the function
* int:iColumn - the id of the column to extract the data from
* bool:bUnique - optional - if set to false duplicated values are …推荐指数
解决办法
查看次数
DataTables错误:"请求的未知参数"
我是DataTables jquery插件的新手.在发现IE 8出现Javascript性能问题后,我决定改变使用DataTables进行服务器端处理的方式.当我的JSP加载时(我正在使用Spring 3),我收到此错误消息:
DataTables warning (table id = 'results_table'): Requested unknown parameter '0' from the data source for row 0
我用Google搜索并发现该错误消息的许多原因归结为格式错误的JSON,因此我找到了一种方法从我的Spring 3控制器函数输出我的JSON来查看它生成的JSON并且我更改了我的代码以使其成为非常接近DataTables网站所说的应该是什么样子.
仍然没有快乐,仍然得到错误信息.
我在DataTables中找到的服务器端处理示例没有包含用于指定客户端使用的列的代码,所以我假设我不需要它.我呢？
以下是我的results.jsp的相关部分:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>ACME: search results in a nice DataTables.net Plugin</title>
</head>
<body>
<link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css" />
<script language = "JavaScript" type = "text/javascript" src = "../nsd/js/jquery-1.7.js"></script>
<script language = "JavaScript" type = "text/javascript" src = "../nsd/js/jquery.dataTables.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#results_table').dataTable( …推荐指数
解决办法
查看次数
无法重新初始化JQuery DataTable
我正在使用jquery数据表来显示网格内的数据.在初始页面加载脚本采取DateTime.Today并进一步处理它们,问题是在初始页面加载之后,当我试图将用户输入日期用于进一步处理时.我有以下错误.
DataTables警告(table id ='dataTable'):无法重新初始化DataTable.要检索此表的DataTables对象,请不要传递任何参数或查看bRetrieve和bDestroy的文档
function getDate() {
var date = $('input[name="myDate"]').val();
return date;
}
$('#myDate').click(updateDate);
function updateDate() {
$('#dataTable').dataTable({
"bServerSide": true,
"sAjaxSource": "/Home/Ajax",
"fnServerParams": function (aoData) {
var date = getDate();
aoData.push({ "name": "myDate", "value": date });
},
//... there's more
}
updateDate();
脚本放在页面底部.
推荐指数
解决办法
查看次数
数据表 - 设置列宽
我正在尝试设置列宽,如下所示:
var per_page = $("table").data("per_page");
$(".table").dataTable({
"aoColumnDefs": [
{ "sWidth": "100px", "aTargets": [ 1 ] },
{ "sWidth": "100px", "aTargets": [ 2 ] },
{ "sWidth": "100px", "aTargets": [ 3 ] },
{ "sWidth": "100px", "aTargets": [ 4 ] },
{ "sWidth": "100px", "aTargets": [ 5 ] },
{ "sWidth": "100px", "aTargets": [ 6 ] },
{ "sWidth": "100px", "aTargets": [ 7 ] }
],
"aoColumns" : [
{ "sWidth": "100px"},
{ "sWidth": "100px"},
{ "sWidth": "100px"},
{ "sWidth": "100px"}, …推荐指数
解决办法
查看次数
数据表.row()未定义
我想通过简单地点击相关的按钮删除行.. 数据表是有效的,我可以使用一些基本的功能,如数据中的排序和搜索,但当我点击按钮它只是简单地说未定义的错误:
为了您的信息,我使用datatable 1.10和jquery 1.10.2
代码:
<table cellpadding="0" cellspacing="0" border="0" class="row-border" id="table">
<thead>
<th>Video ID</th>
<th>Filename</th>
<th>Action</th>
</thead>
<tbody>
<td>1</td>
<td>ABCD</td>
<td><input type='button' name='deleteBtn' value='Delete' />
</tbody>
<tfoot>
<tr>
<th>Video ID</th>
<th>Filename</th>
<th>Action</th>
</tr>
</tfoot>
</table>
<script src="jquery.min.js"></script>
<script src="jquery.dataTables.min.js"></script>
<script type="text/javascript">
var table = $('#table').dataTable( {} );
$('#table tbody').on('click',"input[type='button']",function() {
table
.row( $(this).parents('tr') )**
.remove()
.draw();
});
</script>
</body>
</html>
推荐指数
解决办法
查看次数
Jquery Datatables列的呈现和排序
我正在使用一个数据表,其中包含一列格式的mysql时间戳YYYY-MM-DD HH:MM:SS.我的表设置为最初按此列排序.数据表正确地自动检测时间戳格式并适当地排序.
我现在正试图改变这一列的外观,以便更加用户友好,但不会影响它的排序方式.所以,我正在使用这样的columns.render功能:
{
"data":"created_at",
"name":"date",
"visible":true,
"title":"Date Created",
"render": function(data, type, full, meta){
var date = new Date(data);
var options = {year: "numeric", month: "long", day: "numeric"};
return date.toLocaleDateString('en-US', options);
}
}
一旦我这样做,排序不再正常.我的印象是该render函数应仅影响数据的显示,但仍应根据该行数据对象的基础数据进行排序.这些是我尝试使用的文档(http://datatables.net/reference/option/columns.render).
有谁知道我如何根据实际时间戳排序,但显示更友好的用户日期？
推荐指数
解决办法
查看次数
数据表页面更改回调
我正在使用函数'fnDrawCallback'进行页面更改.它基本上解决了我的目的.唯一的事情是我在初始化dataTable对象时必须指定该函数.有什么办法可以在初始化后完成吗？
例如:我这样做:
$("#tableID").dataTables({'fnDrawCallBack':functionName});
我想这样做:
var oTable = $("#tableID").dataTables();
oTable.fnDrawCallback = functionName; // or something like this
解:
oTable.aoDrawCallback.push(functionObj);
var functionObj = {
fn: funtionName
};
推荐指数
解决办法
查看次数
jQuery dataTables - 左对齐排序图标
正如您所看到的,我的数据表上的排序图标位于该列的最右侧:
是否可以将它们对齐在左侧,以便它们出现在文本之后？
即.
# ^ Technician ^ Completed Date ^
谢谢
所要求的代码:
<div class="dataTable_wrapper">
<table class="table table-striped table-hover" id="table-d">
<thead>
<tr>
<th>{% trans %} id {% endtrans %}</th>
<th>{% trans %} technician {% endtrans %}</th>
<th>{% trans %} date {% endtrans %}</th>
<th>{% trans %} summary {% endtrans %}</th>
</tr>
</thead>
</table>
</div>
和:
$('#table-d').DataTable( {
"processing": true,
"serverSide": true,
"ajax": "{{ path('table_data') }}",
"pageLength": 10
})'
推荐指数
解决办法
查看次数
标签 统计
javascript ×7
jquery ×7
datatables ×4
json ×3
ajax ×1
asp.net-mvc ×1
c# ×1
css ×1
html ×1
jackson ×1
spring-mvc ×1
undefined ×1