Dear Team,
I have strange situation with [table.row($(this).parents('tr')).remove().draw(); ] method it working with one of the table on the same page but not for the other
Please help
http://debug.datatables.net/oculif
↧
draw() method not working on multiple table
↧
ordenar campo fecha d/m/Y /moment.min.js y datetime-moment.js
Hola, tengo un campo fecha tipo d/m/Y 15/12/2017 y estoy intentando poder ordenarla pero no lo consigo, he incorporado moment.min.js y datetime-moment.js pero no entiendo bien como usarlo en mi función.
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script><!---- Es necesario para el datetimepicker--->
<script src="//cdn.datatables.net/plug-ins/1.10.16/sorting/datetime-moment.js"></script>
He visto en los ejemplos que se usa asi:
```$(document).ready(function() {
$.fn.dataTable.moment( 'HH:mm MMM D, YY' );
$.fn.dataTable.moment( 'dddd, MMMM Do, YYYY' );
} );```
Pero no tengo claro donde poner ese codigo en mi funcion, yo creo que en mi caso será algo así.
$.fn.dataTable.moment( 'd/m/Y' );
Gracias
↧
↧
how to change default css in DataTables
Hello! 
Guys i need your help)
i have already installed dataTables and i discover that i need redesign this table for my project.
so i have some questions for you
can i change datatables.min.css ?
or should i override default styles in datatables.min.css by writting styles with higher selectors? 
↧
show Loading... during upload?
https://editor.datatables.net/reference/field/upload fileReadText can be used to control the text shown "when a file is being read before it is uploaded"
My upload takes a bit of time, and there's no indication to the user that the Create window has even accepted his file. I.e., I still see "Choose file..." during the upload. Is there any way from Editor methods or options to control the text while the Create window is waiting for the ajax response?
↧
Populating with all contacts & cutomers.
I have a customers & contacts table. Both tables have unique field custID. contacts table have multiple contacts from one company
I am trying to get the following result
customers.custID | contacts.firstName | contacts.firstName
500 | John | Paul
ie I need them in separate fields.
Is this possible in a MYSQL Query?
If so what is the syntax to use with the editor.
The idea is I can use responsive extension and show the company details and then have all the contacts show on expanding the row.
Or is there another approach?
Cheers
Steve Warby
↧
↧
Datatables select inputs columns filter shows only 10 results when using server side processing
Hi,
I'm trying add select inputs filters on each column, i'm able do add the filters but the select options only shows me the initial 10 results of the first page.
My code
var table = $('#df_form_proprietarios_intervencionar_intervencionados').DataTable( {
dom: 'Bfrtip',
ajax: {url:'df_form_proprietarios_intervencionar.php', type:'POST'},
"scrollX": true,
serverSide: true,
processing: true,
"deferRender": true,
keys: true,
"pageLength": 10,
initComplete: function () {
this.api().columns().every( function () {
var column = this;
var select = $('<select><option value=""></option></select>')
.appendTo( $(column.footer()).empty() )
.on( 'change', function () {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false )
.draw();
} );
column.data().unique().sort().each( function ( d, j ) {
select.append( '<option value="'+d+'">'+d+'</option>' )
} );
} );
},
language: {
url: '//cdn.datatables.net/plug-ins/1.10.16/i18n/Portuguese.json'
},
columns: [
{
"data":"id"
},
{
"data": "linha"
},
{
"data": "predio"
},
{
"data": "aglomerado"
},
{
"data": "nome_proprietario"
},
{
"data": "morada_proprietario"
},
{
"data": "contactos_proprietario"
},
{
"data": "nome_representante"
},
{
"data": "morada_representante"
},
{
"data": "contactos_representante"
},
{
"data": "localizacao_concelho"
},
{
"data": "localizacao_freguesia"
},
{
"data": "localizacao_localidade"
},
{
"data": "vao"
},
{
"data": "x"
},
{
"data": "y"
},
{
"data": "leg_brg"
},
{
"data": "area_por_leg_m2"
},
{
"data": "area_total_proprietrio_m2"
},
{
"data": "indemnizacao_total_proprietario"
},
{
"data": "n_da_carta"
},
{
"data": "data_numeracao"
},
{
"data": "carta_devolvida"
},
{
"data": "motivo_devolucao_ctt"
},
{
"data": "motivo_real_devolucao"
},
{
"data": "data_entrega_ctt"
},
{
"data": "discordancias_por_escrito"
},
{
"data": "assinatura_do_acordo"
},
{
"data": "observacoes_reuniao"
},
{
"data": "reflorestacao"
},
{
"data": "observacoes_reflorestacao"
},
{
"data": "n_intervencao"
},
{
"data": "data_da_intervencao"
},
{
"data": "valor_real_da_indemnizacao"
},
{
"data": "n_rc"
},
{
"data": "data_lib_proc_prej"
},
{
"data": "valor_da_intervencao_pse"
},
{
"data": "observacoes_pse"
},
{
"data": "area_corte_total_pse"
},
{
"data": "destruicao_de_cepos"
},
{
"data": "destrocamento_da_rama"
},
{
"data": "gestao_de_combustivel"
},
{
"data": "metros"
},
{
"data": "dap_5"
},
{
"data": "dap_10"
},
{
"data": "dap_15"
},
{
"data": "dap_20"
},
{
"data": "dap_25"
},
{
"data": "dap_30"
},
{
"data": "dap_35"
},
{
"data": "dap_40"
},
{
"data": "dap_45"
},
{
"data": "dap_50"
},
{
"data": "criado_por"
},
{
"data": "criado_por_id"
},
{
"data": "data_criacao"
},
{
"data": "criado_por_empresa"
},
{
"data": "actualizado_por"
},
{
"data": "actualizado_por_id"
},
{
"data": "data_actualizacao"
},
{
"data": "actualizado_por_empresa"
}
],
select: true,
lengthChange: false,
buttons: [
{ extend: 'create', editor: editor },
{ extend: 'edit', editor: editor },
{ extend: 'remove', editor: editor },
{ extend: 'excel', text: 'Exportar Excel', filename: 'SGIF - Ciclo de Registos e Intervenções' },
]
} );
Can you help me?
↧
ColReorder & Individual Column Filtering Positioned In Header
I know this has been asked before but I cant find a working solution at the moment. I am using a combination of ColReorder, horizontal scrolling and individual column filtering. I cant make the col reorder function work from the top THEAD row and the filtering work from the second THEAD row. Both functions only work if I leave bSortCellsTopas false. However, I need the col reordering to be in the first THEAD row as that is better from a usability point of view.
How I can target the second row in THEAD with this function?
table.columns().every( function () {
var that = this;
$( 'input', this.header() ).on( 'keyup change', function () {
if(that.search() !== this.value){
that
.search( this.value )
.draw();
}
});
});
Any help would be greatly appreciated.
Thanks
Chris
↧
Fixed first column overlaps the horizontal scrollbar
Any one every faced this problem?
See the image below:
I have a fixed first column and enabled scrollX. There is a slight overlap between the first column and horizontal scrollbar.
I am using semantic-ui for styling. And maybe the thickness of the scrollbar is not compatible with the data tables calculations.
My data tables configuration is:
{
fixedColumns: true,
autoWidth: true,
scrollX: true,
scrollY: "500px",
scrollCollapse: true,
paging: false,
ordering: false,
columns: [...]
data: [...]
}
↧
Logic not working as expected.
Hi guys I have the following code which checks for the extension type and display accordingly.
The first section checks to see if it is an image.
The second if it is a video.
The third show id none of the above.
It is failing on ext = JPG ( ie it shows as a link ).
What am I doing wrong here please?
render: function(data, type, row)
{
if (data !== undefined ){
var ext = data.substr(data.lastIndexOf('.') + 1);
if ( (ext === 'jpeg' ) || ( ext === 'jpg' ) || ( ext === 'JPG' ) || ( ext === 'jp2' ) || ( ext === 'png' )|| ( ext === 'gif' ) || ( ext === 'pdf' ))
{
return '<img src=" ' + data + ' "' + imageSize + ' class="info1">';
}
// now check if it is a video
if ( (ext === 'mp4')|| ( ext === 'MOV' ))
{
return ' <video width="320" height="240" controls> <source src=" ' +data + ' " type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>'
}
// last here so must be download
{
var fullPath = data.split('.')[0];
var filename = fullPath.replace(/^.*[\\\/]/, '');
return ' Click to Download <br/> <a href=" '+ data + ' " target="_blank" > '+ data + " </a> ";
}
} else { return '' };
}
}
↧
↧
Problem with modal window on Android mobile
Hi Guys,
http://www.surplusanywhere.com
Click on 'deals'.
Click on 'click to show deal'
The popup window on Android shows way down the screen and is not scaled to the width of the screen.
↧
Extra values submitted to server
Editor is only suppoused to submit values changed in the row to the server, not the whole row values, correct? I have a checkbox in my row that works but it submits 3-4 extra values (not the whole row though) to the server, that sometimes causes issues because they are null. What controls exactly what is submitted by Editor to the server?
↧
Alert elements form returned JSON
I am using the following to set the json returned to a global variable
$('#dtInvoiceDetails')
.on('xhr.dt', function ( e, settings, json, xhr ) {
selectedPrintData = JSON.stringify(json);
} );
the console shows
selectedPrintData = {"data":[{"DT_RowId":"row_10108","inv_list":{"lineID":"10108","InvID":"3113","quantity":"23","barCode":"5555","stockCode":"8686856","size":"77","colour":"","description":"more jjjjjjj","costPrice":"0.00","sellPrice":"5.00","lineTotalNett":"115.00","lineTotal":"0.00","vatRate":"0.00"}}],"options":[],"files":[]}
I have tried
console.log(selectedPrintData[0]['data']['inv_list']['quantity']);
console.log(selectedPrintData[0][data][inv_list][quantity]);
What is the correct way to get thhe returned data into an array then be able to alert the 'quantity' value.
Cheers
Steve Warby
↧
Responsive does not work inside flexbox.
The responsive plugin does not work when inside a flexbox container.
Example: https://jsfiddle.net/ejkp3yv9/
I attempted to add overflow: hidden which had no effect (as mentioned here: https://datatables.net/forums/discussion/33468/datatables-responsive-inside-flexbox-doesnt-hide-columns)
↧
↧
About modify data row object
I have a little question about when modify DataTable data row.
For example:
// Object DataTable get data row
var dataCell = Dtable.row(row).data();
dataCell.id = 10;
When I modify the property value of data object row, in automatically modify in the DataTable JavaScript Object? And is not necessary to do
Dtable.row(row).data(dataCell);
Dtable.row(row).invalidate(); // Is necessary to Add .draw() when invalidate()?
// Or to do
Dtable.rows().invalidate(); // Is necessary to Add .draw() when invalidate()?
I understood what I need to execute .draw() when I want to update the DOM, but is not clear for me how works .invalidate() and if the data row object is modify automatically modify de JavaScript Object contained by DataTable instance.
I'm waiting for you feedback.
↧
Audiot logging for editor.
Hey guys,
I need to add some sort of audit logging for create/delete and edit functions on the data-tables editor. Any examples and help
would be much appreciated.
I'm looking to dump data into an audit table on each action.. something really simple.. doesn't have to dump username or anything.. just data trail.. date+action+data_before+data_after
Example for an edit
[field: date] = {2017-01-10 : 19:05:23}
[field: action] = {edit}
[field: data_before] = {id=1, name="foo baarson", age=110, info="too old"}
[field: data_after] = {id=1, name="bar fooson", age=110, info="too old"}
Example for a create
[field: date] = {2017-01-10 : 19:05:23}
[field: action] = {create}
[field: data_before] = {}
[field: data_after] = {id=1, name="bar fooson", age=110, info="too old"}
Example for a delete
[field: date] = {2017-01-10 : 19:05:23}
[field: action] = {delete}
[field: data_before] = {id=1, name="foo baarson", age=110, info="too old"}
[field: data_after] = {}
This way you can write a recovery script to the side.. like an 'undelete' button.. or even have one inline in the table.
↧
Subarray/nested array not loading correctly
I'm having trouble loading an array that contains a subarray into DataTables correctly. It's structured like this:
I have two semi-working Plunkers that demonstrate what I've tried already.
1) The problem with this first Plunker is that the entire subarray (which contains all of the the x and y values) appears in concatenated form within a single cell of the row in the DataTable that corresponds to the parent row of the main data array.
2) In this second Plunker, also unsuccessful, the problem is that the same x and y values appear for every row.
I've set a bounty for a solution to this problem on Stack Overflow.
What I'm trying to do is get all of the values contained in dataset — specifically, state, record, x, and y — to display correctly in the DataTable. Can anyone demonstrate a solution that would fix one of these Plunkers?
↧
custom sorting column on the basis of priority for datatable
I want to custom sort data Table on the basis of priority. I have written code as follows. can anyone help me with please. I saw some solution here in this forum. My problem is: its not sorting properly. I want to sort forth column on the basis of priority but it is not working as expected.
here is my code
$(document).ready(function() {
$('#dashboard').DataTable({
"lengthMenu" : [ [ 25, 50, 75, -1 ], [ 25, 50, 75, "All" ] ],
"pageLength" : 200,
"aoColumns" : [ null, null, null, {
"sType" : "priority",
"bSortable" : true
} ]
});
});
function getPriority(name) {
var rankNumber;
if (name == "High - 1st") {
rankNumber = 1;
} else if (name == "High - 2nd") {
rankNumber = 2;
} else if (name == "High - 3rd") {
rankNumber = 3;
} else if (name == "High - 4th") {
rankNumber = 4;
} else if (name == "High - 5th") {
rankNumber = 5;
} else if (name == "High") {
rankNumber = 6;
} else if (name == "Medium") {
rankNumber = 7;
} else if (name == "Low") {
rankNumber = 8;
} else if(name == "") {
rankNumber = 9;
}
return rankNumber;
}
jQuery.fn.dataTableExt.oSort["priority-desc"] = function(x, y) {
return getPriority(x) < getPriority(y);
};
jQuery.fn.dataTableExt.oSort["priority-asc"] = function(x, y) {
return getPriority(x) > getPriority(y);
}
I have attached my screen shot of table. Forth column(i.e Requested Priority) is sorting randomly(expected to sort on the basis of rankNumber but not working) Can anyone help me with this.
Thank you in advance!
↧
↧
Is it possible to initialize a table with more elements within a cell?
I am wondering whether I am able to put several HTML elements within a table cell upon initialization?
For example: if I wanted to have one cell that has a company's name AND a company's logo within the same cell, how could I accomplish that?
↧
Data for file() from javascript
Hello, is there way to somehow insert data about uploaded files to datatables instance when using javascript array data source?
I am using own server code and only JS part of Datatables+Editor.
When using ajax data source, then there is no problem (ajax request returns {data: [...], files: [...]} and i can use file() method to get info about file with specified id in display function.
I cant get it to work when using javascript data source. I can pass only array for row data.
↧
Jquery Datatable Searching and paging not working
Iam using Jquery data tables with Jquery templates.
while the data is binding to table but searching and paging not showing even iam specified conditions.
Iam using following code.
<script src="~/Content/assets1/js/jquery-1.11.0.min.js"></script>
<link href="~/Content/DataTable/datatables.min.css" rel="stylesheet" />
<script src="~/Scripts/DataTable/datatables.min.js"></script>
<script src="~/Scripts/TemplateScripts/jquery.tmpl.js"></script>
function Bindtable(data) {
var appRoleList = data.response;
if (appRoleList.length > 0) {
$("#tblUsers").DataTable().destroy();
$("#scriptUserInfo").tmpl(appRoleList).appendTo("#tbodyUsers");
var mast_table = $('#tblUsers').DataTable();
var appRoleTable = mast_table.dataTable({
"pageLength": 5,
"bSort": false,
"bPaginate": true,
"bLengthChange": false,
"bFilter": true,
"bInfo": false,
"bAutoWidth": false
});
}
}
↧