Quantcast
Channel: DataTables 1.9 — DataTables forums
Viewing all 1816 articles
Browse latest View live
↧

some rows mis-aligned in IE9 - when over 100 per page selecte

January 21, 2014, 9:13 am
$
0
0
Hi,

I have an IE9 issue when I select show 100 rows per page from the drop down. When this is selected, occasionally, as I am paging through, a row will seem to be 'pushed' one cell to the right thereby not aligning with the rest - not necessarily the whole row either sometime just the last 2 cells. When I export the data it all exports correctly in the right columns. I must stress it is only the odd one row here and there. The HTML looks fine and it isn't to do with any record in particular.

Interestingly the below link has no mis-aligned rows:
http://live.datatables.net/opOh/1

but this has the problem I am reporting on a few rows:
http://live.datatables.net/opOh/1/edit

It works fine in IE10/11 and Chrome.

To confirm it is only when "show 100 entries" is selected.

Cheers.
↧
Search

shift-click select not working

January 21, 2014, 8:47 am
$
0
0
http://debug.datatables.net/exuxis
http://jsfiddle.net/bigsipper/CDdbX/

Using the code found here as an example: datatables.net/forums/discussion/14165/multi-select-with-ctrl-click-and-shift-click/p1

I'm trying to get shift-click select working - but nothing happens. No select high lighting - with single click, or shift-click.
There are no errors on the console. I've pretty much copied the example verbatim.
If I put code breaks in with Firefox debug, I can tell no callbacks are triggered.
What am I doing wrong?
↧
↧

FixedColumn table load slowly under IE8

January 21, 2014, 6:29 pm
$
0
0
Hi Team,
I got some performance problems when using fixedcolumn table 1.9.4 (jquery 1.8.3) under IE8.
My table is huge and include columns(280) x rows(40). it cost more than 50 seconds initialize my table.
And my IE browser will popup a warning ask me whether to stop the javascript process.
Can we make it load faster? under 10 seconds would be fine. :)

$(document).ready(function(){
var start = new Date().getTime();
var oTable = $('#table1').dataTable({
"sScrollX": "100%",
"sScrollY": "300px",
"bPaginate": false
});
new FixedColumns( oTable );
var end = new Date().getTime();
alert((end-start)/1000);

});

Thanks for your help.
↧

Selected Row datatables does not work

January 22, 2014, 2:53 am
$
0
0
Hello,

I am trying to add the functionality in my table to be able to select single rows and highlight the one selected.

I am using the following code but it seems that nothing happens, when I click on any row it does nothing, it does not add the class that I have specified.

This is the code:

$(document).ready(function(){
var $objTable = $('#dataTableCustomerSearch').dataTable({
'bJQueryUI' : true,
'bFilter' : true,
'bPaginate' : false,
'bInfo' : true,
'sScrollY': '250px',
'bScrollCollapse': true,
'bSort' : true,
'bAutoWidth' : false,
'oLanguage' : {
'sLengthMenu' : 'Show _MENU_ Entries',
'sEmptyTable' : 'No Entries',
'sZeroRecords': 'No Entries Found',
'sInfo' : 'Search Results: _TOTAL_ customers'
},
'sDom': 'T<"top"i>rt',
'oTableTools': {
'sSelectedClass': 'selectedRow',
'sRowSelect': 'single'
},

'aoColumnDefs': [
{ 'aTargets': [0], 'bSortable': true, 'bSearchable': true },
{ 'aTargets': [1], 'bSortable': true, 'bSearchable': true },
{ 'aTargets': [2], 'bSortable': true, 'bSearchable': true },
{ 'aTargets': [3], 'bSortable': true, 'bSearchable': true },
{ 'aTargets': [4], 'bSortable': true, 'bSearchable': true }
]
});


Can anyone tell me whether they had the same issue and how to solve it?

Thank you very much in advance.

Regards
↧

Column filtering on URL query string

January 22, 2014, 4:17 am
$
0
0
Hi,

Can someone help me with automatically filtering a column from a URL query string.

At the moment I can set the value of my column filter to value in my URL. However I have to hit return or type in a space in the column filter in order for it to return rows matching my filter.

http://79.174.222.26:8080/dashboard/portal.php?ref=23456

In the above example I want my data in column 0 to automatically filter values containing 23456 in them automatically.

Would appreciate any help.

Thanks
↧
↧

individual column filtering meets AJAX source!

August 2, 2013, 6:18 pm
$
0
0
Hi,

I am trying to get the individual column filtering (select) example working with an AJAX source.

The table displays perfectly but at this point, unfortunately, all my drop downs are empty.

My code is as follow:

$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"sAjaxSource": 'json.txt',
"aoColumns": [
{ "mData": "id_region" },
{ "mData": "region_name" },
{ "mData": "division" }
]
} );

$("tfoot th").each( function ( i ) {
this.innerHTML = fnCreateSelect(oTable.fnGetColumnData(i));
$('select', this).change( function () {
oTable.fnFilter( $(this).val(), i );
} );
} );
} );

apparently, oTable.fnGetColumnData returns an empty array because aiRows.length is always 0. I just don't understand why!

Am I doing something wrong?
↧

Show/hide multiple columns at once

January 6, 2014, 3:43 pm
$
0
0
I want to show/hide groups of columns based on filters (represented as links) next to my table. Each filter will be a JS array containing the column indices to display.

Any ideas how to do this?

PS. I assume on click of each filter I would hide all the table columns then selectively show the columns I want based on the values in the array. Not sure how best to do this, either.
↧

Sort on custom data

January 22, 2014, 11:41 am
$
0
0
I am using a json object to display my data in the datatable.

Although I am passing the complete json object to the datatable function, I am only displaying some things in the json object in my data table.

But I want to sort my datatable with an attribute that I am not displaying.

Is this possible?
↧
Search

Images are '404 Not Found' on datatables.net.

January 22, 2014, 5:08 pm
$
0
0
I am waiting for the 2.1.6-dev TableTools package... but for now, I am using nightly builds:
   <link   href="//datatables.net/download/build/nightly/jquery.dataTables.css" rel="stylesheet" type="text/css" />
   <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script&gt;
   <script src="//datatables.net/download/build/nightly/jquery.dataTables.js"></script>
   <link   href="//datatables.net/download/build/TableTools.nightly.css" rel="stylesheet" type="text/css" />
   <script src="//datatables.net/download/build/TableTools.nightly.js"></script>

In the Firefox console, I am getting this error:

"NetworkError: 404 Not Found - http://datatables.net/download/build/images/sort_asc.png&quot; sort_asc.png
"NetworkError: 404 Not Found - http://datatables.net/download/build/images/sort_both.png&quot; sort_both.png

Can this be fixed, or is there a way I can work around it? My columns are not showing the 'sort' buttons and I need
this functionality.

-Bigsipper
↧
↧

Index column (static number column) + Server-Side-Processing = Missing Column Index numbers...

January 23, 2014, 5:35 am
$
0
0
Hi everyone,

I didn't know under which category I should put this, so I picked "DataTables 1.9".

I am using server-side-processing to get all the data on screen. But once I change the number of shown entrys ( 'bLengthChange': true ) or use the navigation ( 'bPaginate': true ), the index column numbers aren't there anymore.

They are there every time I reload the whole page.

Same sever-side-script is in use in all cases.

Is this some kind of a bug? Or do I need to add anything in my code below?

oTable = $('.datatable').dataTable({
            "bServerSide": true,
            "sServerMethod": "POST",
            "sAjaxSource": "ajax/datatables.content.php",
            'bLengthChange': true,
            'bPaginate': true,
            "iDisplayLength": 25,
            "aLengthMenu": [[25, 50, 75, -1], [25, 50, 75, "All"]],
            'sPaginationType': 'full_numbers',
            'bInfo': false,
            'oLanguage': 
            {
                "sProcessing":   "Bitte warten...",
                "sLengthMenu":   "_MENU_ Einträge anzeigen",
                "sZeroRecords":  "Keine Einträge vorhanden.",
                "sInfo":         "_START_ bis _END_ von _TOTAL_ Einträgen",
                "sInfoEmpty":    "0 bis 0 von 0 Einträgen",
                "sInfoFiltered": "(gefiltert von _MAX_  Einträgen)",
                "sInfoPostFix":  "",
                "sSearch":       "Suchen:",
                'oPaginate': 
                {
                    'sNext': '&gt;',
                    'sLast': '&gt;&gt;',
                    'sFirst': '&lt;&lt;',
                    'sPrevious': '&lt;'
                }
            },
            "sDom": 'T<"H"lfr>t<"F"ip>',
            "oTableTools": {
                "aButtons": [
                    "copy", "csv", "xls", "pdf",
                    {
                        "sExtends":    "collection",
                        "sButtonText": "Save",
                        "aButtons":    [ "csv", "xls", "pdf" ]
                    }
                ]
            },
            'aoColumns': [
                { "bSortable": true, "aTargets": [ 0 ] },
                null,
                null,
                null,
                null,
                null,
                null,
                null,
                null,
                { "sType": "html" },
                { "bSearchable": false, "bVisible":    false }
            ],
            "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 );
                    }
                }
            }
        });
↧

Individual column filtering (using "select" elements)

January 23, 2014, 4:00 pm
↧

Getting a TypeError when calling 'fnPreRowSelect' - e is undefined.

January 23, 2014, 11:02 am
$
0
0
http://jsfiddle.net/bigsipper/nwMAP/ http://debug.datatables.net/elukep

I am using an example from a previous discussion to 'disable' row selection on certain columns.
http://datatables.net/forums/discussion/comment/42209

But when I run, it throws a Javascript exception:

TypeError: e is undefined
if ( $(e.srcElement).hasClass('open_modal') ) {

Ummmmm.... this is on a 'click' event, so.... how could the event not be defined?

            "oTableTools": {
               "sRowSelect": "os",
               "aButtons": [ "select_all", "select_none" ],
               "fnPreRowSelect": function ( e, nodes ) {
                  if ( $(e.srcElement).hasClass('open_modal') ) {       //<<< this is where it stops.
                     return false;
                  }
                  return true;
               },
↧

jquery datatable hide column by name

January 23, 2014, 9:45 pm
$
0
0
Hi All ,

I really love this plugin ..its simply awesome. i am new to it .. so please tell me how can i hide whole column by its name . tried to google this but just found following code and similar things : -
this.fnSetColumnVis(5, true);

Please help , Thanks :) .
↧
↧

Chinese translation report export to pdf display "???"

January 24, 2014, 1:49 am
$
0
0
I have few language for my report. However, when in Chinese simplified, the pdf that been export shows "???" in all the header and footer. Anyone has idea how to fix this?

The way I did is echo the php translation key into the javascript. It is working on the report that being generated and display on browser. However, not on the exported pdf file report.
Example aoColumns:
"aoColumns": [
{ "sTitle": "<?php echo $lang['report-card number'];?> ", "mData": "membership", "sType": "string", "bSearchable": false, sDefaultContent: "n/a", "bSortable":false},
{ "sTitle": "<?php echo $lang['report-registration date'];?>", "mData": "reg_date", "sType": "string", "bSearchable": false, sDefaultContent: "n/a", "bSortable":false},
{ "sTitle": "<?php echo $lang['report-email'];?> ", "mData": "reg_email", "sType": "string", "bSearchable": false, sDefaultContent: "n/a", "bSortable":false},
],

Example my header and footer:
<tr>
<th width="auto"><?php echo $lang['card number'];?></th>
<th width="auto"><?php echo $lang['report-registration date'];?></th>
<th width="auto"><?php echo $lang['report-email'];?></th>
</tr>
↧

Post initialise access to multiple datatables on one page

January 24, 2014, 3:01 am
$
0
0
Hi there,

Myself and a fellow developer are having a major headache with this one.

We have (currently) 4 datatables on a single page and two of which we have a checkbox to allow the user to select all of the currently filtered results.
We do this via:
var oTable = $('.downdatatable').dataTable();
		$('input', oTable.$('tr', {"filter": "applied"} )).prop('checked',chk);

However that bit of code is run via a click event on the checkbox and it works, to an extent.
When we reinitialise the datatable (oTable) it duplicates the filters.
This seems to be be because the .downdatatable class we reinitialise is wrapped by a datatable header if re-sets up the table inside of the previous wrapper and we end up with a datatable inside of another datatable wrapper,
If we keep clicking the checkbox the datatable keeps getting smaller and smaller.

We have followed another post that mentions setting up a global array $.fn.dataTableInstances[] and putting the datatable in there.

That also works fine but only for the last table to be initialised.

Allan mentioned the $.fn.dataTableSettings keys need to be the same as the keys in dataTableInstances. However this only ever contains one element which is the last tables settings.

We can load all the datatables via the array but cannot run any functions against it as we get the error:

TypeError: oSettings is null
	

var aoData = oSettings.aoData;

jquery....js (line 4979)
↧
Search

Problem with server-side processing

January 24, 2014, 7:01 am
$
0
0
Hello,

I've got a problem when I'm trying to make my datatable with a JSON File...

See my HTML code below :


<html>
<head>
		<title>Extraction des users avec liste des droits</title>
		<link rel="stylesheet" type="text/css" href="complete.css">
		<link rel="stylesheet" type="text/css" href="infobulle.css">
		<script type="text/javascript" language="javascript" src="../media/js/jquery.js"></script>
		<script type="text/javascript" language="javascript" src="../media/js/jquery.dataTables.js"></script>
		<script type="text/javascript" language="javascript" src="../media/js/jquery.dataTables.columnFilter.js"></script>
		
		
		<script type="text/javascript">
			$(document).ready(function() {
				$('#tab_droits').dataTable( {
					"bProcessing": true,
					"bServerSide": true,
					"sAjaxSource": "recup_Users.php"
				} );
			} );
			
		</script>
</head>
<body>
		<div id="container">
	
		<table class="pretty" align="center" id="tab_droits">
		<thead><tr><th>LOGON</th>
				<th>NOM</th>
				<th>DATE MODIFICATION</th>
				<th>LIRECL</th></tr></thead>
				
	<tbody>
		<tr>
			<td colspan="4" class="dataTables_empty">Loading data from server</td>
		</tr>
	</tbody>
		<tfoot><tr><th>LOGON</th>
				<th>NOM</th>
				<th>DATE MODIFICATION</th>
				<th>LIRECL</th></tr></tfoot>
	</table>
</div>
</body>
</html>

There is nothing that change in the page... There is diplayed "Processing..." at the top of it, but no data to appears...

My Json file given by "recup_Users.php", seems correct to me also :


{"sEcho":0,"iTotalRecords":20,"iTotalDisplayRecords":20,"aaData":[["00460","LANG","050628","0"],["0587","CURELLI","051027","0"],["0968","VISCO","051027","0"],["1499","DERVAULT","051027","0"],["1698","KAMRAOUI","060209","0"],["1750","POULAIN","060411","0"],["2085","ANDRIEUX","051027","0"],["2237","BONNEHON","051027","0"],["2851","SUDRE","050812","0"],["3035","DAVID","050525","0"],["3045","SOULA","060308","0"],["3081","MAILLOCHON","050525","0"],["3167","ROBERT","051027","0"],["3489","COSTES","050628","0"],["4461","MARCON","050923","0"],["4462","BEAU","060209","0"],["4849","AUZEMARIE","051019","0"],["5242","CROUAU","060209","0"],["58F","GALEY","110420","0"],["6083","LAVIOLETTE","060120","0"]]}

I have no Javascript Error (I tried with a inexistant php file, and I've got an error, so the HTML see the php file)
I'm pretty sure I'm missing an obvious thing... But what ?

Thank you by advance for your help ! I'm looking for few hours...
And sorry for my english (I'm a french developper).
↧

populate data in datatables based on user input.

January 25, 2014, 2:41 am
$
0
0
Hi friends,

Good day to you.

My name is giridhar,i have a doubt regarding data tables.

Iam getting data from controller to populate data in my datatables.

I need to get the data based on one input field(in my case customerid).

how should i achieve this.I tried but failed.

My jsp should contain an input field.Based on the input of the user i should display the data into datatable.

The input field and datatable should be independent to each other.


please help me.this is my code

<script type="text/javascript">
$(document).ready(function() {
$("#user").dataTable({
"bProcessing" : true,
"bServerSide" : true,
"sAjaxSource" : "./CustomerService",
"sPaginationType" : "full_numbers",
"bPaginate" : true,
"bJQueryUI" : true,
"aaSorting": [[0,'desc']]
})
});
</script>

</head>
<body>

<form>
customerId: <input type="text" name="custid" id="custid" />
<input type="submit" value="Submit" id="search" >
</form>



<div id="demo">

<table cellpadding="0" cellspacing="0" border="0" class="display"
id="user">
<thead>
<tr>

<th>CustomerName</th>
<th>Address</th>
<th>MobileNumber</th>


</tr>
</thead>

<tbody>
</tbody>
</table>
</div>

</body>
</html>
↧
↧

How to save oTable to MySQL

January 25, 2014, 6:42 am
$
0
0
I've read through the doc and came across this qualifier:

Data is not saved to the server at the moment, just the local DataTables instance - so a reload takes the table back to it's original state. An XHR call to the server would be needed to save the user input information into a database (in saveRow).

Question: how do you save the final edited data, in this case presumely the oTable instance, into an MySQL db?

Example: "customer_table" with unique id "id" and customer phone number "phone". The edited fields would "phone". After all the inline editing are done, how would you save all of the edited data to MySQL db? I hope to be able to save edited data either one row at a time (nRow) or the entire table (oTable) with multiple rows edited in a single click.

Sample codes would be greatly appreciated.
↧

Character encoding problem

January 25, 2014, 7:13 am
$
0
0
Hi,
i use server-side processing with datatables 1.9.2 and i display some data with Greek characters that all change to ????
this is probably an encoding problem.
I used this 
 header("Content-Type: text/json; charset=UTF-8");

to the server-side script but nothing happend.

The strange is that everything was working fine and this problem started when i changed vps server.
Any solution?
↧

How to output oTable to an external Var for further data manipulation

January 25, 2014, 8:16 am
$
0
0
Say we have a table of 100 customer records with unique field "id" and field "name". In datatable, only customer names starting with alphabet "A" is filtered. So for example there are 5 customers with names starting with an "A".

If I wish to output these 5 records into a Var for further external data manipulation, how can I call on oTable (presumably) to output the 5 customer records into an array for external data manipulations?
↧
Viewing all 1816 articles
Browse latest View live
Search