I'm just like wtf.
I don't know. All I was trying to do is .css("font-size", "xx-small") and I realize I'm selecting... I don't even know what I'm selecting.
Can someone explain this picture to me?
I'm just like wtf.
I don't know. All I was trying to do is .css("font-size", "xx-small") and I realize I'm selecting... I don't even know what I'm selecting.
Can someone explain this picture to me?
Hi,
I am trying to add a simple colvis button on the table, The button is added to the page but the drop down list if not selectable. Please see the snapshot below:
I have ColVis checkboxes dropdown, I need to hide specific columns by default (need some specific checkboxes unchecked by default)
Here http://infra.clarin.eu/content/libs/DataTables-1.10.6/extensions/ColVis/examples/title_callback.html is what I can see but we don't have any such option to uncheck some of them.
I have tried to hide columns using "drawCallback" function using its settings parameter but no luck.
What should be the better approach, do we have any existing solution /api for this or we need to write a workaround?
Thank you for your help!
Is that confirmed issue, or is it in my implementation only that the filter input fires twice. Once immediately on the first letter typed, and second time after the set delay time. I see that in few of my datatables implementations for version 1.10.10
Following the discussion:
https://datatables.net/forums/discussion/comment/114990/#Comment_114990
I can check the data and cancel the deletion of the row using "return false"
->on( 'preRemove', function ( $editor, $id, $values ) {
$editor->validator( function ( $editor, $action, $data ) {
... some validator logic
return false;
} );
} )
I would like to have an example of how I can also return an error message...
thank you,
One of my column is for long text content (for product description). In order not to increase the row height in the table, any way to show partial of the text and also show "read more" at the cell? The full content can be expanded if the cell is clicked. or hovered. Thank you.
Currently I have a standard aspx webform that adds table rows/cells within the Page_Load function. Can DataTables.net be used with dynamically created tables?
Hi everyone,
When I try to search for Rio de Jan.. using the default search input, without quotes, it seems to ignore the Rio de phrase, and considers only the last word Jan.
I have to put the query terms into quotes ( "Rio de Jan...") to work. Is there any setting that allows the quote query to be the default one?
Thanks,
Guilherme
Can someone explain why the second to last line here does not add a class of 'tablecell' to all my <td> elements?
$(document).ready(function() {
var table = $('#ratings-table').DataTable({
"ajax": 'table_senate_info.json',
"columns": [
{ "data": "ratingPhrase" },
{ "data": "state" },
{ "data": "fullName" },
{ "data": "trump_margin" },
{ "data": "firstName" },
{ "data": "lastName" },
{ "data": "raceRatingID" },
{ "data": "open_seat" }
],
"columnDefs": [
{ targets: [4, 5, 6, 7], visible: false },
{
"targets": 2,
"render": function(data, type, row) {
return data + ' (' + row.open_seat + ')';
}
},
{ "orderData": 5, "targets": 2 },
{ "orderData": [6, 5], "targets": 0 }
],
renderer: "bootstrap",
responsive: "true",
});
table.$('td').addClass('tablecell');
});
I'm trying to figure out if this is possible. When a user scrolls up or down the datatable the following is always visible at the head...
Dear Allan,
If no order variable is setup, and despite the first column is setup with orderable at false, then the POST order variable indicates by default the column 0. If the column is a technical column not binded to the database, eg. to handle checkbox for selecting rows, then AJAX answers an error "unknow field" on column 0.
I have setup an order in all cases to avoid this problem.
However this is a bug that may create real problems. You can patch it with sending null and avoid any order in this case in PHP, or with a loop in javascript to take the first orderable column instead of 0.
Hoping this report helps.
Regards,
Gilles
Dear Allan,
I have a datatable with a createdRow function which calls $("td:eq(1)", row).append(...)
It works perfectly with stateSave: true, OR with serverSide: true
However, when using stateSave AND serverSide at the same time, it works on very first webpage call (because cache is empty, so stateSave does not affect loading) and if I refresh the webpage, my custom HTML is no more visible. I need to change sorting, or change page, and come back to the first page to see my custom HTML. If I press F5, same problem occurs again and again.
Same behavior on Firefox and Chrome.
PS: I have tried to add something like table.rows( row ).invalidate().draw(); but it does solve anything, and prevents other pages to display the HTML: I suppose because this should not be called inside createdRow.
Do you have a solution?
I'd like to have a column which is the secondary sort for any other column in descending order. In other words, when a user clicks on a column to sort, it, of course, sorts by that column first and then by that secondary column. The secondary column should always be in descending order. The one exception is where the secondary column becomes the primary column. Then it can either descending or ascending as normal.
Let me give you an example. Given a table with 5 columns (A,B,C,D,E), column B is the "secondary" column in question. I see how to set the initial sort order, so this is about sorting from user interaction. I set the initial sort order to descending for column B.
User clicks on Column C. The sort should now be C (ascending), B (descending).
User clicks on Column D. The sort should now be D (ascending), B (descending).
User clicks again on Column D. The sort should now be D (descending), B (descending).
User clicks on Column B. The sort should now be B (descending).
User clicks again on Column B. The sort should now be B (ascending).
User Clicks on Column A. The sort should now be A (ascending), B (descending).
Hopefully that made sense.
Hey. Wondering if you have something already built. I'm using something like https://datatables.net/examples/api/form.html. I have an onchange event that get's the data when changed and passes it to my DB. Instead of clicking on the next text box. I would like it to auto select the next row, same column input box
We are using DataTable with Fixed Columns, Scroller, Editor and KeyTable with inline editing and using server-side rendering.
We are having an issue with being unable to edit any of the fixed columns (there are 6). When clicking into a fixed column cell, the orange editor outline appears but there is no cursor and cannot be typed into. If I click on the same cell again, it seems that sometimes I am editing the table underneath. We also have validation rules on these cells, and error message will sometimes cause the fixed columns and the table underneath to be misaligned.
Please let me know what is the best way to engage support for this issue. I tried re-creating our scenario on http://live.datatables.net/seweyepe/1/edit (this is in-work).
Hello people,
i build a table from a DB with 2 dropdown filter (col 5 and col 7), i can export the correct data chosen from dropdown but i can't get the rest of data from table.
I don't want to export col 0 and when i export without col 0, the data was exported to the wrong column in the file.
This is the code that i use:
exportOptions : {
columns: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16],
format: {
body: function( data, row, col, node ) {
// This is what i want
if (col == 5) {
valor5=minha.tabela
.cell( {row: row, column: col} )
.nodes()
.to$()
.find(':selected')
.text();
}
if (col == 7) {
valor7=minha.tabela
.cell( {row: row, column: col} )
.nodes()
.to$()
.find(':selected')
.text();
return valor7;
}
// This does't work to export the rest of the table.
outros=minha.tabela
.rows()
.data()
.to$()
.text();
return outros;
}
}
}
}
],
I want to put the data to the right column and export all data to the file, please help and i'm sorry for my bad english.
I'd like to default sort a column (know how to do this) AND hide the sorting option on my other columns. Is this possible with DataTables? I can't find the option.
Thanks!
Hi---I have a JSON file that contains document titles and a URL for each. So far I've been able to render each document into my table. I also rendered each url into the first table row as a test. It was good that they appeared but it's not what I'm going for.
How can I make it so that each document title is linked with its respective URL? I didn't see any info. about it in the manual or the forum so I thought I'd ask.
If you'd like to see a snippet of the JSON file, please let me know.
import $ from 'jquery';
import JSONfile from '../../../public/JSONfile.json';
import { basename } from 'path';
import dt from 'datatables.net';`
var tableRes = '';
export default class {
constructor() {
this.loadData();
this.loadTableData();
}
loadTableData() {
$.noConflict();
let tableRes = JSONfile.d.results.filter(function(val) {
return (val.FileLeafRef.trim().length > 0);
}).map(function(obj) {
return {
// "FileName": obj.FileLeafRef,
// "Path": obj.EncodedAbsUrl, ///// these are the URLs for each document
"Titles": obj.File.Name
}
});
$('#km-table-id').DataTable( {
columns: [
{ "data": " " },
{ "data": "Titles" }, ///// Ideally I want each Title to be linked in the table---i.e. the document names appearing blue
{ "data": " " }
],
data: tableRes,
"pagingType": "full_numbers"
});
}
}
hello everybody ! I am getting data from api and I wanted use my custom function in success getting data from api. I try but in table nothing showing maybe anything is wrong ... thanks in advance!
var table = $("#table").DataTable({
"ajax": {
url:"/profiles_list",
type: "POST",
dataSrc: "",
deferLoading: 57,
success: function(){
muFunction()
console.log('yes');
},
error:function(error){
console.log('error');
}
}
});
Working code
{ data: 'id' , "render": function ( data, type, full, meta ) {
return
'<a href="/admin/user/'+data+'/'+'edit" class="btn btn-primary" ><span data-feather="edit"></span></a>';
}}
this code is not working
{ data: 'id' , "render": function ( data, type, full, meta ) {
return
'<a href="/admin/user/'+data+'/'+'edit" class="btn btn-primary" ><span data-feather="edit"></span></a>';
+' '+
'<form method="POST" action="{{route('admin.user.destroy', data)}}">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-danger"><span data-feather="delete"></span></button>
</form>'
}}