DataTables 1.9 — DataTables forums

How can I put the search label inside the input?

AluminumCat — Thu, 12 Dec 2013 08:35:49 +0000

Hi, Is there a way to put the search-label inside the text input, rather than have it outside? I've tried searching for a solution, but have found none so far.

Create custom cell content using callback

santjago — Thu, 12 Dec 2013 08:46:50 +0000

I've a problem generating custom contents for some cells when making fnUpdate.

Here's table definition:
[code]
defaultsTable = $('table.defaults-table').dataTable({
"bProcessing": true,
"bLengthChange": false,
"iDisplayLength": 10,
"sAjaxSource": "{{ url_for('.json_get_data', aid=0) }}",
"sAjaxDataProp": "data",
"aoColumns": [
{"mData": "country", "fnCreatedCell": buttonCell},
{"mData": "operators", "fnCreatedCell": buttonCell},
{"mData": "platform", "fnCreatedCell": valueCell},
{"mData": "type", "fnCreatedCell": valueCell},
{"mData": "amount", "fnCreatedCell": createCell},
{"mData": "id", "fnCreatedCell": actionCell}
]
});

function createCell(nTd, sData, oData, iRow, iCol) {
$(nTd).addClass('align-center');
}
function valueCell(nTd, sData, oData, iRow, iCol) {
createCell(nTd, sData, oData, iRow, iCol);
$(nTd).text(sData.name);
}

function actionCell(nTd, sData, oData, iRow, iCol) {
createCell(nTd, sData, oData, iRow, iCol);
var removeUrlTpl = '{{ url_for('.json_delete_rate', rid=".RID.") }}';
var removeAction = $('');
removeAction.text('Delete');
removeAction.click(function() { removeRow($(this).parent().parent()); });

//var editUrlTpl = '{{ url_for('.json_edit_rate', rid=".RID.") }}';
var editAction = $('');
editAction.text('Edit');
editAction.click(function() { editRow($(this).parent().parent()); });

editAction.appendTo($(nTd).empty());
removeAction.appendTo($(nTd));
}

function buttonCell(nTd, sData, oData, iRow, iCol) {
createCell(nTd, sData, oData, iRow, iCol);
var button = $('');
var toolTip = [];
for (var i = 0; i < sData.length; i++) {
toolTip[toolTip.length] = sData[i].name + (sData[i].hasOwnProperty('code') ? ' (' + sData[i].code + ')' : '');
}
button.data('content', toolTip);
button.html('See tooltip');
button.popover();
button.appendTo($(nTd).empty());
}

[/code]

So, this code works perfectly on table first render. But when I need to update a table row (and guess the right way is to call fnUpdate) the table contents of the given row messes up.

I've also tried to update the code to use "mRender" property of columns definitions (so createCell is called in fnCreatedCell and all other funcs are bound to mRender. That only works when mRender bound function returns textual data. As soon as mRender.call() returns jQuery object the result is also a mess.

So what's the proper way to use custom cell contents on both first render and row/cell update?

I've read already some discussions on fnCreatedCell problems, someone made an advice to call fnCreatedCell manually with no sample though.

Datatables in modal windows can not get json data form server side

holala — Thu, 12 Dec 2013 09:45:54 +0000

I click a button call a bootstrap modal,and modal content get by remote.
the remote content has datatable,the data source sets by ajax,but the ajax can not run.
I don't know why?
Please HELP! Thanks
my modal window code:

ID
Col1
Col2
Col3

Empty

$(document).ready(function () {
$("#purchase-grid").dataTable({
"bProcessing": true,
"bServerSide": true,
//ajax invoke json
"sAjaxSource": "js/data/devices-onsale.json",
"sPaginationType": "bootstrap",
"sScrollY": 300,
"sScrollX": "100%",
"sScrollXInner": "100%"
});
});

Fetch server params of a datatable

sdinesh21 — Thu, 12 Dec 2013 07:16:22 +0000

Hi Allan,

I use Datatables 1.9 for a server side datatable which I refresh every 5 seconds. For a table, I want to fetch the server parameters that are being passed in the request. I tried fetching by calling aoData of the datatable but it has the table records in it. How else could I fetch the request parameters alone?

Set Value to "Whatever" From SQL String

Hayezb — Wed, 11 Dec 2013 17:28:00 +0000

Hello!

I'm using DataTables w/ CodeIgniter and have a column with some values in it ( 4 different ones ) and instead of it being 5, 10 etc.. displaying in the table I want them to be 5 = 'Example 1', 10 = "Example 2", etc...

I'm sure this is something easy to do :)

Patch for forced secondary etc. sorts

syndesis — Wed, 04 Dec 2013 19:53:52 +0000

I had a requirement similar to the one in http://www.datatables.net/forums/discussion/comment/45129

You mentioned that maybe DataTables should provide an option for this internally so I added one. This option is nearly identical to aaSortingFixed, except it sorts after the selected sort instead of before. Patch follows. Please let me know if I should submit a pull request or if you think it should be implemented in a different way.

[code]
diff --git a/media/js/jquery.dataTables.js b/media/js/jquery.dataTables.js
index 89179c8..ea39b9e 100644
--- a/media/js/jquery.dataTables.js
+++ b/media/js/jquery.dataTables.js
@@ -2057,7 +2057,11 @@
aaSort = ( oSettings.aaSortingFixed !== null ) ?
oSettings.aaSortingFixed.concat( oSettings.aaSorting ) :
oSettings.aaSorting.slice();
-
+
+ if ( oSettings.aaPostSort !== null ) {
+ aaSort = aaSort.concat( oSettings.aaPostSort );
+ }
+
for ( i=0 ; i

iDisplayLength: -1 bug

hugi — Wed, 11 Dec 2013 14:39:12 +0000

Hello,

I using DataTables 1.9 with client side data. We show normaley all row elements with the option iDisplayLength: -1.
The problem appears if the user deletes the last element in the datatable. The paging "previous" is active, although there are no rows in the datatable.

We can use fnClearTable as workaround.

Small demo: http://live.datatables.net/ivakuc/edit#javascript,html
Delete three times the first row and check the paging links.

Thanks
hugi

Change bSortable on callback

tjeerdkramer — Mon, 09 Dec 2013 15:52:26 +0000

I am trying to change the "bSortable" attribute of a specific column after the data is being received from the server, based on iTotalDisplayRecords > 100000.

Is there some way to do it?

Export checkbox checked state to excel

rkbabu — Wed, 11 Dec 2013 06:20:01 +0000

We need to export the checkbox checked state(True/False) to excel.
Currently it exports empty string.

This is the code currently we using

*Dynamically change lang according to localization*/
var langFile = "../Scripts/jquery.dataTables.en-US.txt";
if (locale === "zh-cn") {
langFile = "../Scripts/jquery.dataTables.zh-CN.txt";
}

var fileName = ($('#ctl00_hdnXlsFileName').val() || "xlsfileName");

var oTable = $('.gvDataTable').dataTable({
"oLanguage": {"sUrl": langFile},
"sScrollX": "99%",
"bDestroy": true, //To retrieve the datatables object for this table, pass no arguments or see the docs for bRetrive and bDestory
"bStateSave": true, //http://datatables.net/forums/discussion/573/how-to-stay-on-current-page-after-re-draw/p1
"fnDrawCallback": function (oSettings) {
/* Need to redo the counters if filtered or sorted */
if (oSettings.bSorted || oSettings.bFiltered) {
for (var i = 0, iLen = oSettings.aiDisplay.length; i < iLen; i++) {
$('td:eq(0)', oSettings.aoData[oSettings.aiDisplay[i]].nTr).html(i + 1);
}
}
$('.cbShowOrHideGvCols').appendTo('div.DTTT_container'); /*Put checkboxlist for show/hide columns after excel export*/
},
/*"sDom": 'r<"H"lf><"datatable-scroll"t><"F"ip>',*/
"sDom": '<"H"lTfr><"datatable-scroll"t><"F"ip>',
"oTableTools": {
"sSwfPath": "../Scripts/media/swf/copy_csv_xls_pdf.swf",
/*"sSwfPath": "http://datatables.net/release-datatables/extras/TableTools/media/swf/copy_csv_xls_pdf.swf",*/
"aButtons": [{ /*http://datatables.net/extras/tabletools/button_options*/
"sExtends": "xls",
"sFileName": fileName,
"sButtonText": "",
"sTitle": fileName.replace("xls","")
}
]
}
});

Using javascript parameters to build a server-side WHERE filter

akrinsky — Tue, 10 Dec 2013 09:28:24 +0000

I was hoping to filter the list of possible places in my database to the State of California (CA) prior to editing. In fact, I would like to marshall up a whole bunch of COLUMN = VALUE filters and have them filter down the rows passed to the grid.

This usage is not working... am I missing something?

$('#Places').dataTable( {
"sDom": "Tfrtip",
"sAjaxSource": "php/table.Places.php",
"bServerSide": true,
"sServerMethod": 'POST',
"fnServerParams": function ( aoData ) {aoData.push( { "name":"STATE","value":"CA" } )},
"aoColumns": [
{
"mData": "STATE"
},
{
"mData": "CITY"
}
],
"oTableTools": {
"sRowSelect": "multi",
"aButtons": [
//{ "sExtends": "editor_create", "editor": editor },
{ "sExtends": "editor_edit", "editor": editor },
{ "sExtends": "editor_remove", "editor": editor }
]
}
} );
} );

How to always sort all columns by a last column, giving preference to existing sort options?

Kyopaxa — Thu, 29 Aug 2013 01:44:07 +0000

Hi,

I have a table that groups rows by different columns selected by the user. To perform the grouping it uses aaSortingFixed for the column being grouped at that moment.

Now I am in need to always sort by a last column Z. This sort by Z should be applied always in the last position, giving preference to any other sort options currently applied by the user.

I tried using aDataSort for every column, specifying Z as the last column to sort with. The problem is that this approach doesn't work as intended when aaSortingFixed points to a column that uses aDataSort. What happens is that aaSortingFixed will be applied first and will use aDataSort to also sort by Z, then the rest of the sort options will be applied AFTER the sorting by Z.

Here is a fiddle example of the problem: http://jsfiddle.net/HNTez/2/

Is there any option like aaSortingFixed but that applies the fixed sort at the end instead of at the beginning? If not, wouldn't it be a nice feature to have? It could be called aaSortingFixedLast for example.

Header columns are not aligned with the data columns

fboland — Fri, 06 Dec 2013 16:53:58 +0000

Hi,

All is on the title, i search on the forum and find a lot of discussion about this problem but without a solution for me.

You can show a screenshot here : http://lerelaisimmobilier.com/Screenshot.png

And the datatable code :
[code]
$.ajax(
{
type: 'GET',
dataType: 'json',
url: "ajax/DataTable.php",
data: {'dataTableName':Self_dataTable.dataTableName, 'required':'ColumnsDef'},
success: function(dataCols)
{
// Mise à jour de la variable des champs
fields = dataCols.aoColumns;

// Création du datatable
Self_dataTable.dataTable = $table.dataTable(
{
"sDom": "RrtS",
"sScrollX": "100%",
"sScrollY": "500px",
"bServerSide": true,
"bProcessing": true,
"aoColumns": fields,
"bDeferRender": true,
"sAjaxSource": "ajax/DataTable.php",
"fnServerData": function (sSource, aoData, fnCallback, oSettings)
{
// Ajout de paramètre supplémentaire

// Type de demande "données"
aoData.push({'name':'required', 'value':'Data'});

// Nom du dataTable
if(!$.isNue(Self_dataTable.dataTableName)) aoData.push({'name':'dataTableName', 'value':Self_dataTable.dataTableName});

// Paramètre ajax
if(!$.isNue(Self_dataTable.paramAjax)) aoData.push({'name':'paramAjax', 'value':Self_dataTable.paramAjax});

// Exécution de la requête ajax
oSettings.jqXHR = $.ajax(
{
"dataType": 'json',
"type": "GET",
"url": sSource,
"data": aoData,
"success": function(data)
{
// Exécution de la fonction par défaut
fnCallback.call(null, data);
}
});
}
});
}
});
[/code]

"fields" var json lool like this :
[code]
{
"aoColumns":[
{
"sTitle":"aze",
"mData":"toto",
"sDbOrder":"toto",
"sDbSearch":"toto",
"sType":"string",
"sWidth":"200px",
"sClass":"align-center",
"bSortable":true,
"bSearchable":true
},
{
"sTitle":"aze",
"mData":"tata",
"sDbOrder":"tata",
"sDbSearch":"",
"sType":"string",
"sWidth":"90px",
"sClass":"align-center",
"bSortable":true,
"bSearchable":true
},
{
"sTitle":"aze",
"mData":"titi",
"sDbOrder":"",
"sDbSearch":"",
"sType":"string",
"sWidth":"90px",
"sClass":"align-center",
"bSortable":true,
"bSearchable":true
},
.....
]
}
[/code]

Reinitialise DataTable error

samir_gambler — Tue, 10 Dec 2013 11:43:22 +0000

Hello,
I am using DataTable to display details in table form. I am using server side processing to populate table with data and has below function in the page.
[code]
$(document).ready(function() {
$('#sample_editable_1').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "includes/merchant_processing.php"
} );
App.init();
TableEditable.init();
} );
[/code]
I am using 'table-editable.js' file to add the feature of inline editing. In that file there is again initialization of dataTable
[code]
var oTable = $('#sample_editable_1').dataTable({
"aLengthMenu": [
[5, 15, 20, -1],
[5, 15, 20, "All"] // change per page values here
],
// set the initial value
"iDisplayLength": 5,

"sPaginationType": "bootstrap",
"oLanguage": {
"sLengthMenu": "_MENU_ records",
"oPaginate": {
"sPrevious": "Prev",
"sNext": "Next"
}
},
"aoColumnDefs": [{
'bSortable': false,
'aTargets': [0]
}
]
});
[/code]
Due to this I am getting error
[code]
DataTables warning (table id = 'sample_editable_1'): Cannot reinitialise DataTable.

To retrieve the DataTables object for this table, pass no arguments or see the docs for bRetrieve and bDestroy
[/code]
Please guide me how to avoid this error.

Thanks,
Samir

How to validate data in the table while editing

samir_gambler — Tue, 10 Dec 2013 07:46:04 +0000

Hi,
I am using DataTablles to make editable table and allow user to edit the data. I can achieve this but how to validate the data entered by the user during editing.
Thanks,
Samir

Change Columns header movement effect on ipad

fboland — Fri, 06 Dec 2013 13:54:22 +0000

Is it possible to change columns header effect movement on ipad ?

My datatable have more columns than is displayable on screen, so i have a scroll on y axes.

When i scroll on right, there is a not terrible small animation to forward columns.

I would like to change this animation.

Is there a callback to override the default animation ?

Wath's the best practice ?

Thx

Sorting Image position Issue.

gbalu — Mon, 09 Dec 2013 15:05:47 +0000

I was using data tables plugin for sorting and pagination. It works fine. But am having the issue in displaying the Sorting Image.
The Sorting image are displaying in right end of each TH, But i want to display it next to the text. How it can be done? I tried overriding the CSS bt nothing works out

How to add extra column

samir_gambler — Mon, 09 Dec 2013 10:18:51 +0000

Hello,
I was looking at your DataTables plugin and I found it very useful. I came across a web page that is using DataTable to display data. Currently table detail is directly entered in the html page with two extra column to edit the entry and delete the row. I am able to get the data from server side processing but I am unable to add two columns to edit and delete the entry. Can you please guide me how to add these column.

Thanks,
Samir

Search Function stops when using GROUP BY in server processing

ESHam — Mon, 09 Dec 2013 08:27:58 +0000

Hello All..
I have a server processing table that queries from 2 tables and groups the results.. When searching the results are not working ERROR 1064 (MYSQL SYNTAX ERROR near WHERE) If i remove Group by from the code everything works fine but i get multiple results from the parent record. Any ideas? Thank you.

[code]

$aColumns = array( 'accountname', 'accountAddress1', 'accountAddress2', 'accountCity', 'accountState', 'accountZip', 'accountphone', 'accountemail', 'accountWebSite', 'accountFax','tasktitle');

$sIndexColumn = "accountname";
$sTable = "accounts";
$sJoin = "LEFT JOIN tasks on accounts.accountname = tasks.taskresource GROUP BY accounts.accountname";
$gaSql['user'] = "xx";
$gaSql['password'] = "";
$gaSql['db'] = "xx";
$gaSql['server'] = "localhost";

/*
* Local functions
*/

function fatal_error ( $sErrorMessage = '' )
{
header( $_SERVER['SERVER_PROTOCOL'] .' 500 Internal Server Error' );
die( $sErrorMessage );
}

/*
* MySQL connection
*/
if ( ! $gaSql['link'] = mysql_pconnect( $gaSql['server'], $gaSql['user'], $gaSql['password'] ) )
{
fatal_error( 'Could not open connection to server' );
}

if ( ! mysql_select_db( $gaSql['db'], $gaSql['link'] ) )
{
fatal_error( 'Could not select database ' );
}

/*
* Paging
*/
$sLimit = "";
if ( isset( $_GET['iDisplayStart'] ) && $_GET['iDisplayLength'] != '-1' )
{
$sLimit = "LIMIT ".intval( $_GET['iDisplayStart'] ).", ".
intval( $_GET['iDisplayLength'] );
}

/*
* Ordering
*/
$sOrder = "";
if ( isset( $_GET['iSortCol_0'] ) )
{
$sOrder = "ORDER BY ";
for ( $i=0 ; $i intval($_GET['sEcho']),
"iTotalRecords" => $iTotal,
"iTotalDisplayRecords" => $iFilteredTotal,
"aaData" => array()
);

while ( $aRow = mysql_fetch_array( $rResult ) )
{
$row = array();
//$row[] = $OpenAccountTasks;
$row[] = '';
for ( $i=0 ; $i
[/code]

Sort column with thousand separator

andrechagas — Sat, 07 Dec 2013 12:45:40 +0000

Hello

I am having problem to sort a column with thousand separator. How can I solve this case?

thank you

Sorting Images

gbalu — Sun, 08 Dec 2013 12:59:36 +0000

How to align sorting images after text. Present it is aligned to faraway to text. I want to align beside tex

page event firing even when a disabled pager is clicked

IndusCreed — Sat, 07 Dec 2013 03:48:37 +0000

Hi.

First of all, thanks for creating dataTables. I have used it in multiple projects and absolutely love it.

Anyways, I created this code snipped on Data tables live: http://live.datatables.net/ihipox/2/edit#javascript,html

When the "previous" button is clicked (which is disabled), the "page" event still gets fired. I would expect the event to fire only when the page is actually changed.

Here is dataTable code on line 2963 copied from function _fnPageChange ( oSettings, mAction ):
[code]
$(oSettings.oInstance).trigger('page', oSettings);

return iOldStart != oSettings._iDisplayStart;

[/code]

Shouldn't it be something like this instead:

[code]
var bPageChanged = iOldStart != oSettings._iDisplayStart;
if (bPageChanged) {
$(oSettings.oInstance).trigger('page', oSettings);
}
return bPageChanged;

[/code]

I am using v1.9.4. Thank you, again.

Compatible DataTables (v 1.94) with I.E 7 ?

vigalego — Fri, 06 Dec 2013 16:22:32 +0000

I would like to know if datatables version (v 1.94) runs with I.E 7...

Mouse wheel vertical scrolling over fixed column

levi — Wed, 27 Nov 2013 16:51:30 +0000

Hi there,

I started using DataTables last month, and I have been incredibly impressed with how flexible and easy to use it has been. Thank you!

I just have a quick question: I am using fixed columns and sScrollY together, just like in this example: http://datatables.net/extras/fixedcolumns/

I notice that in the example and in my implementation, using the mouse wheel to vertically scroll does not cause the table to scroll when the mouse is positioned over the fixed column (i.e. the DTFC_LeftBodyWrapper & DTFC_Cloned area of the table).

Since the fixed column is not an index column and is styled like the rest of the table, I would love it if mouse wheel vertical scrolling worked over the fixed column. I've tried handling the scroll event of DTFC_LeftBodyWrapper, but was unable to create the desired effect. Is there any known way to achieve vertical scrolling so that scrolling over the fixed column provides the same action as scrolling over the other columns?

Thank you!

Levi

weird displacement contained in the table with finger

fboland — Fri, 06 Dec 2013 13:40:41 +0000

Hi,

When i move in the table content holding my finger, the displacement is strangely.

1st :The content is movable on x axes and y axes on the same time.
2nd : The content can be move out of the screen leaving a white space.

Can someone give me a solution to lock that ?

Thx

Filtering and html

karine — Thu, 05 Dec 2013 15:12:12 +0000

As I understand of some older threads, there is a bug in 1.9.4, that won't strip off the html in a column when filtering the table. I haven't found any recent information about this, so I would like to ask if anyone has found a good solution to this problem?

Datatables, jEditable and MVC C# server creates invisible table

f_strandner — Fri, 06 Dec 2013 09:19:50 +0000

Hello everyone.

I've been trying to implement a editable table and for one minor detail everything works fine. When I edit the value of a cell I get a new hidden table underneath the table that was edited. This table seems to contain only one row, the last row of the "real" table. This of course results in a web page that grows a little bit for every edit you do.
At first I thought it was something wrong with my JavaScript code but I then replaced all my client side code (both JavaScript and html) with the one found here:
[quote]
http://www.datatables.net/release-datatables/examples/api/editable.html
[/quote]

I should probably also mentioned that I did replace the url in the example to /Some/Url
and that I'm using N2CMS. Don't know if the last bit is relevant, but if it is I've mentioned it...

As long as I return an empty string from my server it works in that I don't get the extra hidden table. I also of course get empty cell i my table.
When I return a non-empty string I get this strange behavior with the extra table and the text returned ends up in the edited cell.

this code gives the hidden table:
[code]
public string EditTable2(int? id, int? row_id, string value, int? column)
{
return value;
}
[/code]

whereas this doesn't

[code]
public string EditTable2(int? id, int? row_id, string value, int? column)
{
return "";
}
[/code]

I took a look at the response sent from the server, with the help of Firebug and DragonFly, in the example linked above and tried to make my response look the same by doing this:

[code]
public string EditTable2(int? id, int? row_id, string value, int? column)
{
return value + " (server updated)";
}
[/code]

but all that did was to give me some extra text in the table cell. The extra table remained.

Oh, one more thing. This happens in Firefox, Opera/Presto, Opera/Chrome, Google Chrome and Internet Explorer 11.

All this points to there is something wrong with my response from the server and obviously I'm missing something but I just can't figure it out. Is there any one who knows what I'm doing wrong?

About the notice for a link to a page showing the problem. I can't put one here, you need an user account to access it, but if you are reading this Alan I can e-mail you the information if you wish.

Any help very much appreciated!

/Fredrik

Too many ajax request

fboland — Thu, 05 Dec 2013 08:34:09 +0000

Hi,

I'm trying to run datatable in server side processing mode with scroller like in this example : http://datatables.net/release-datatables/extras/Scroller/server-side_processing.html

Here is my code :

[code]
$(document).ready(function()
{
$('.datatable1').dataTable(
{
"sScrollY": "500px",
"sAjaxSource": "TestDataTableAjax1.php",
"bServerSide": true,
"sDom": "frtiS",
"oScroller": { "loadingIndicator": true }
});
});
[/code]

The problem is that when i scroll slowly, i realize that several ajax request are done instead of one.
For one mouse wheel, all these request are done :

[code]
http://web.toto.com/TestDataTableAjax1.php?sEcho=2&iColumns=2&sColumns=&iDisplayStart=12&iDisplayLength=189&mDataProp_0=0&mDataProp_1=1&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&_=1386231889586

http://web.toto.com/TestDataTableAjax1.php?sEcho=4&iColumns=2&sColumns=&iDisplayStart=36&iDisplayLength=189&mDataProp_0=0&mDataProp_1=1&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&_=1386231889588

http://web.toto.com/TestDataTableAjax1.php?sEcho=3&iColumns=2&sColumns=&iDisplayStart=20&iDisplayLength=189&mDataProp_0=0&mDataProp_1=1&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&_=1386231889587

http://web.toto.com/TestDataTableAjax1.php?sEcho=5&iColumns=2&sColumns=&iDisplayStart=50&iDisplayLength=189&mDataProp_0=0&mDataProp_1=1&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&_=1386231889589

http://web.toto.com/TestDataTableAjax1.php?sEcho=7&iColumns=2&sColumns=&iDisplayStart=66&iDisplayLength=189&mDataProp_0=0&mDataProp_1=1&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&_=1386231889591

http://web.toto.com/TestDataTableAjax1.php?sEcho=6&iColumns=2&sColumns=&iDisplayStart=58&iDisplayLength=189&mDataProp_0=0&mDataProp_1=1&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&_=1386231889590
[/code]

In the example (http://datatables.net/release-datatables/extras/Scroller/server-side_processing.html) only 2 are done :

[code]
http://datatables.net/release-datatables/extras/Scroller/media/data/server_processing.php?sEcho=2&iColumns=5&sColumns=&iDisplayStart=2&iDisplayLength=81&mDataProp_0=0&mDataProp_1=1&mDataProp_2=2&mDataProp_3=3&mDataProp_4=4&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&sSearch_2=&bRegex_2=false&bSearchable_2=true&sSearch_3=&bRegex_3=false&bSearchable_3=true&sSearch_4=&bRegex_4=false&bSearchable_4=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&bSortable_2=true&bSortable_3=true&bSortable_4=true&_=1386232219852

http://datatables.net/release-datatables/extras/Scroller/media/data/server_processing.php?sEcho=3&iColumns=5&sColumns=&iDisplayStart=22&iDisplayLength=81&mDataProp_0=0&mDataProp_1=1&mDataProp_2=2&mDataProp_3=3&mDataProp_4=4&sSearch=&bRegex=false&sSearch_0=&bRegex_0=false&bSearchable_0=true&sSearch_1=&bRegex_1=false&bSearchable_1=true&sSearch_2=&bRegex_2=false&bSearchable_2=true&sSearch_3=&bRegex_3=false&bSearchable_3=true&sSearch_4=&bRegex_4=false&bSearchable_4=true&iSortCol_0=0&sSortDir_0=asc&iSortingCols=1&bSortable_0=true&bSortable_1=true&bSortable_2=true&bSortable_3=true&bSortable_4=true&_=1386232222426
[/code]

Is it normal ? How is it manage ?

Thx

Server Side Processing + Show/ Hide

ESHam — Tue, 03 Dec 2013 07:05:06 +0000

Hello I am trying to get show hide to work with server side. I get "Requested Unknown Parameter".
[code]

$aColumns = array( 'accountid', 'accountname', 'accountAddress1', 'accountphone', 'accountemail');

$sIndexColumn = "accountname";

/* DB table to use */
$sTable = "accounts";

/* Database connection information */
$gaSql['user'] = "XX";
$gaSql['password'] = "";
$gaSql['db'] = "XX";
$gaSql['server'] = "XX";

/* Local functions*/

function fatal_error ( $sErrorMessage = '' )
{
header( $_SERVER['SERVER_PROTOCOL'] .' 500 Internal Server Error' );
die( $sErrorMessage );
}
/*
* MySQL connection
*/
if ( ! $gaSql['link'] = mysql_pconnect( $gaSql['server'], $gaSql['user'], $gaSql['password'] ) )
{
fatal_error( 'Could not open connection to server' );
}

if ( ! mysql_select_db( $gaSql['db'], $gaSql['link'] ) )
{
fatal_error( 'Could not select database ' );
}

/*
* Paging
*/
$sLimit = "";
if ( isset( $_GET['iDisplayStart'] ) && $_GET['iDisplayLength'] != '-1' )
{
$sLimit = "LIMIT ".intval( $_GET['iDisplayStart'] ).", ".
intval( $_GET['iDisplayLength'] );
}
/*
* Ordering
*/
$sOrder = "";
if ( isset( $_GET['iSortCol_0'] ) )
{
$sOrder = "ORDER BY ";
for ( $i=0 ; $i $iFilteredTotal,
"aaData" => array()
);

while ( $aRow = mysql_fetch_array( $rResult ) )
{
$row = array();

for ( $i=0 ; $i
[/code]
My HTML
[code]

Rendering engine
Browser
Platform(s)
Engine version
CSS grade

Loading data from server

Rendering engine
Browser
Platform(s)
Engine version
CSS grade

[/code]
Finally My Script:
[code]

function fnFormatDetails ( oTable, nTr )
{
var aData = oTable.fnGetData( nTr );
var sOut = '';
sOut += 'Rendering engine:'+aData[1]+' '+aData[4]+'';
sOut += 'Link to source:Could provide a link here';
sOut += 'Extra info:And any further details here (images etc)';
sOut += '';

return sOut;
}

$(document).ready(function() {
/*
* Insert a 'details' column to the table
*/
var nCloneTh = document.createElement( 'th' );
var nCloneTd = document.createElement( 'td' );
nCloneTd.innerHTML = '';
nCloneTd.className = "center";

$('#example thead tr').each( function () {
this.insertBefore( nCloneTh, this.childNodes[0] );
} );

$('#example tbody tr').each( function () {
this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] );
} );

/*
* Initialse DataTables, with no sorting on the 'details' column
*/
var oTable = $('#example').dataTable( {
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [ 0 ] }
],
"aaSorting": [[1, 'asc']],
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "CJS/Myjson.php",

"aoColumns": [
{ "sClass": "center", "bSortable": false },
null,
null,
null,
{ "sClass": "center" },
{ "sClass": "center" }
],

});

$('#example tbody td img').live('click', function () {
var nTr = this.parentNode.parentNode;
if ( this.src.match('details_close') )
{
/* This row is already open - close it */
this.src = "assets/advanced-datatable/examples/examples_support/details_open.png";
oTable.fnClose( nTr );
}
else
{
/* Open this row */
this.src = "assets/advanced-datatable/examples/examples_support/details_close.png";
oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
}
} );
} );

[/code]

Pass parameters to php file with "client side" processing rather "server-side"

hdsa — Thu, 05 Dec 2013 16:35:31 +0000

Is it possible to pass a varible to the php json file and don't use "bServerSide": true?
Ex: I need my DataTable to only show information of the year 2013 (select box value) that the user select.

Best regards.

right align?

degenaro — Fri, 29 Nov 2013 13:00:43 +0000

I have code like this:

[code]

var oTable;
$(document).ready(function() {
oTable = $('#jobs-table').dataTable( {
"bProcessing": true,
"bPaginate": false,
"bFilter": true,
"sScrollX": "100%",
"sScrollY": "600px",
"bInfo": false,
"sAjaxSource": "ducc-servlet/json-format-aaData-jobs",
"aaSorting": [],
"aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0 ] } ],
"fnRowCallback" : function(nRow,aData,iDisplayIndex) {
$('td:eq(0)', nRow).css( "text-align", "right" );
$('td:eq(1)', nRow).css( "text-align", "right" );
$('td:eq(3)', nRow).css( "text-align", "right" );
$('td:eq(8)', nRow).css( "text-align", "right" );
$('td:eq(9)', nRow).css( "text-align", "right" );
$('td:eq(10)', nRow).css( "text-align", "right" );
$('td:eq(11)', nRow).css( "text-align", "right" );
$('td:eq(12)', nRow).css( "text-align", "right" );
$('td:eq(13)', nRow).css( "text-align", "right" );
$('td:eq(14)', nRow).css( "text-align", "right" );
$('td:eq(15)', nRow).css( "text-align", "right" );
$('td:eq(16)', nRow).css( "text-align", "right" );
$('td:eq(17)', nRow).css( "text-align", "right" );
$('td:eq(18)', nRow).css( "text-align", "right" );
$('td:eq(19)', nRow).css( "text-align", "right" );
$('td:eq(20)', nRow).css( "text-align", "right" );
return nRow;
},
} );
} );

[/code]

Works as expected using FF. But with Chrome, columns 19 and 20 are not right-aligned. Any suggestions as to what I might be doing wrong?

Thanks.

Lou.