Hi folks,
I haver to work with decimals (comma) and thousands ( dot) separators. I set the datatable to work with it And it works fine. But it does not work when the Number is smaller the 1000 and of course does not have thousand separators.
Numbers are
1.234,13
876,40
32,79
1.004,23
When I click column head to sort it Goes like this
1.004,23
1.234,13
32,79
876,40
Can anyone help?
Thanks in avance
Moises
Is there any initiative to have DataTables operate without jQuery as a dependency?
**Hi sorry something went wrong i posted this question 2 times, the other one can be deleted maybe? **
Hi Guys,
I really like all the options DataTables offer, but i have an problem:
The following works: (loads my datatable with json which contains table header names + data for in tbody):
$.ajax({
"url": 'java/medewerkers.json',
"dataType": 'json',
"success": function (json) {
var table = $('#customersTbl').DataTable(json);
}
});
});
// json:
{
"columns": [
{
"title": "Firstname",
"data": "employee_name"
},
],
"data": [
{
"id": "cb0_1034400",
"employee_name": "Ha",
"employee_firstnames": "Har",
"employee_surname": "Bos",
"employee_gender": "m",
"employee_mobile": "06 53",
"employee_emailaddress": "h@g.com"
}
]
}
But when i want to add this to my live project which contains alot of parameters and settings in the datatable like so:
function toDataTable(json) {
var table = $('#customersTbl').DataTable({
data: json,
buttons: [
{
extend: 'colvis',
text: '<i class="fa fa-wrench"></i>',
init: function (api, node, config) {
$(node).removeClass('btn-secondary')
$(node).addClass('btn-outline-secondary')
}...
or something like:
var table = $('#customersTbl').DataTable({
"ajax": {
"url": "path/path.json",
dataSrc:'tried every way mentioned on the website.'
},
buttons: [
{
extend: 'colvis',
text: '<i class="fa fa-wrench"></i>',
init: function (api, node, config) {
$(node).removeClass('btn-secondary')
$(node).addClass('btn-outline-secondary')
}....
It just doesn't work, tried everything i could find or come up with.. I only get the following error:
VM817 jquery.dataTables.min.js:66 Uncaught TypeError: Cannot read property 'aDataSort' of undefined.
I tried every suggestion on the website. Put the ajax function in the datatable func.
With or without on succes. with type: json etc etc tried everything.
Any suggestion guys?
Hello,
I'm sorry if this question has already been asked before, I have some issues with DataTables : export buttons are not displayed with my table, and I really don't understand why...
The error message displayed is : "Uncaught TypeError: Cannot set property 'swfPath' of undefined".
I join to this post a few parts of my code.
If somebody is able to help me, it would be nice 
(Sorry for my bad english, it's not my native language).
Suppose we have lac of records, in this case suppose it will take 5 seconds to get the records, and we have 5 character word needs to be searched, then it will send the 5 requests on the server according to the entered character, which is wrong according to me. Is there any alternate of this?
Hi,
At creation I want my users to pick a word that will be part of a url. When they have choosen a word I add the rest ("https://myexample.com/") of the url by using a server side preCreate function. After that I would like to validate the url. But my code right now only validates the single word written by the user, and not the whole url created with my function. Any suggestions how to validate after, not before I set my new value?
->on( 'preCreate', function ( $editor, $values ) {
$editor
->field( 'link' )
->setValue("https://myexample.com/".$word)
->validator( 'Validate::url', array(
'message' => 'Not a url'
));
} )
Following my previous post where I asked how to sort a column of <select> tags (as in this example)
I want to be able to search my column for selected items that match my search query (this doesn't happen in the example mentioned btw).
Is there a way to do that?
This is the relevant part of my code:
// This function is triggered whenever there is a click event on the checkboxes
appListFiltersClick: function(){
console.log(this.appListFilters);
// Build a regex filter string with an or(|) condition
var types = jQuery_3_3_1(this.appListFilters).filter('input:checked').map(function() {
console.log(this.value);
return /*'^' +*/ this.value /*+ '\$'*/;
}).get().join(' ');
console.log(types);
//filter in column 0, with an regex, no smart filtering, no inputbox,not case sensitive
this.$appList.columns('.seto').search(this.value).draw();
},
// Create the appList DataTable for dislay
createAppListTable: function(data){
var that = this;
this.$appList = this.$appList.DataTable({
data: data,
columns: [
{
title: 'Application',
data: 'app'
},
{
orderDataType: 'dom-select',
searchable: true,
className: 'seto',
title: 'Set to',
data: 'list_type',
width: '100px',
render: function(data){
var select = '<select>';
for (var i=0; i<4; i++) {
if (data.toUpperCase() === that.listTypes[i].toUpperCase())
select += '<option value="' + that.listTypes[i].toLowerCase() + '" selected="true">' + that.listTypes[i] + '</option>';
else
select += '<option value="' + that.listTypes[i].toLowerCase() + '">' + that.listTypes[i] + '</option>';
}
select += '</select>';
return select;
}
}
],
responsive: true,
language: {
search: '',
searchPlaceholder: 'Search Application'
},
processing: true,
autoWidth: false
});
/* Create an array with the values of all the select options in a column */
jQuery_3_3_1.fn.dataTable.ext.order['dom-select'] = function ( settings, col ) {
return this.api().column( col, { order:'index' } ).nodes().map( function ( td, i ) {
return $('select', td).val();
} );
}
},
Hello Friends, I'm displaying a datatable with information from a mysql table. I need to send back an aditional value taken from the same table, but i dont have to display this value in the datatable colums.
Since ajax retrun the columns that have to be displayed I dont know how to include a variable with a value that i need not for displaying in the datatable.
Any Idea?
Thanks a lot
Hello Friends, I need to get the value in a variable from a datable every time is loaded (without click on it) from a specfiic cel) (i.e first row, first column)
is it possible ?
Thanks a lot
I'm trying to get started with a very basic grid as follows:
I receive data as a variable:
var x =
[
{"one":"2018352845","date":"07/25/2018","time":"15:15:10"},
{"one":"2018354815","date":"07/26/2018","time":"17:05:15"},
{"one":"2018357762","date":"07/28/2018","time":"10:42:55"}
]
I then try to bind to the html grid as such:
$('#gridContent').DataTable({
data: x,
columns: [
{ data: 'one' },
{ data: 'date' },
{ data: 'time' }
]
});
my html table looks like:
| One | Date | Time |
|---|
What i get is:
DataTables warning: table id=gridContent - Requested unknown parameter 'one' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4
Any ideas as I'd like to think I've got it setup right based on the documentation I've read so far.
Thanks,
I'm combining a complex header and fixed columns:
1) complex header: https://datatables.net/examples/basic_init/complex_header.html
2) fixed columns: https://datatables.net/extensions/fixedcolumns/examples/initialisation/left_right_columns.html
It works fine but is there a way to remove the scrollbar from the fixed header columns? I've outlined the bit I'd like to remove.
Basically, I want to make it like this: https://jsfiddle.net/brianlmerritt/8c5jgs4b/ but with DataTables and complex header.
Here's my own fiddle: https://jsfiddle.net/omgLswq6/151/
Hi,
I've rendered a dropdown into my datatables so the user can select a value. When I go to export that with excel, it outputs the two dropdown values together. How can I make it so it outputs what the user selects?
Thanks!
Pessoal ,alguém tem um exemplo de reordenação do índice da datatable atualizado o mesmo ao arrastar as linhas?
Tenho uma tabela que apresentação informação de funcionários ,preciso que o índice seja atualizado conforme as linhas são arrastadas.EX: 1- Carlos
2- João
Ao trocar as linhas de lugar preciso que o índice seja atualizado
1- João
2 - Carlos.
Hi, I'm trying to implement server-side processing, because my table with 20k rows is really slow (loading time 30s.) I'm using Python/Flask. I added the javascript code with correct id and path to serverside.php, which is in the same directory and to the same directory I uploaded ssp.class.php. My table is the same as in the template here:
https://datatables.net/examples/data_sources/server_side
I did'nt use the "ajax" part, because I don't know where it belongs 
When I run my application, only the "Show entries", "Search panel", Column names and footer column names are displayed. Immediately I get this error:
DataTables warning: table id=example - Ajax error. For more information about this error, please see http://datatables.net/tn/7
and everytime I click on the column names, I get the same error again.
In the console I found this error:
Debug code: awuzaz
Thank you for any advice.
Hi when using an date picker on mobile device (example iphone7), the date picker opens, but i am not able to choose the month or the year, because the choices instantly disappear after clicking.
I used the following example:
- https://editor.datatables.net/examples/inline-editing/responsivequick
See attached video:
- please rename to .mov
I want to add 508 Accessibility to a check box. I have a select check box with user full name columns. How do I create the Ariel-label for the check box to have the name column information.
Hello,
I just downloaded the newest datatables, bootstrap 3, jquery, editor and am finding that my button for column visibility is no longer working. The button does give a dropdown of the columns, but when I select a column nothing happens (it does not toggle).
What might I be missing.
It is a button
button:[colvis] ...
thanks,
evan
FixedColumns 3.2.6
DataTables 1.10.19
Scrolling either the fixed column side or the non fixed column side causes the rows to not scroll together. Also, when I scroll past the end of the top or bottom of the list, there is this "bounce" that again causes the rows to be misaligned. This appears to not be a problem in either firefox or chrome...only safari.
see animated gif: https://cl.ly/a08b0dd28b28/Screen%252520Recording%2525202018-08-27%252520at%25252001.47%252520PM.gif
Hello All !
Just want to share this with you all and ask you could help me test it !
I used the plugin Perfect Scrollbar with Datatables and the result was... INCREDIBLE !!!!
The result : https://ibb.co/mPNvyU
Here is the plugin page: https://github.com/utatti/perfect-scrollbar
Please test it and give feedback here ! Thank you !
Here is my table code:
```// begin first table
var grid = $('#gTable').DataTable({
ajax: url,
responsive: !0,
deferRender: !0,
scrollY: "500px",
scrollCollapse: !0,
scroller: !0,
"fnInitComplete": function () {
//$('.dataTables_scrollBody').perfectScrollbar();
const ps = new PerfectScrollbar('.dataTables_scrollBody');
},
//on paginition page 2,3.. often scroll shown, so reset it and assign it again
"fnDrawCallback": function (oSettings) {
//$('.dataTables_scrollBody').perfectScrollbar('destroy').perfectScrollbar();
//ps.update();
const ps = new PerfectScrollbar('.dataTables_scrollBody');
}
});```