Hi!
I use datatables 1.10, but php is still 5.3.
I get this error:
<b>Warning</b>: explode() expects parameter 2 to be string, array given in <b>/Applications/MAMP/htdocs/amministrazione/Datatables/php/Vendor/htmLawed/htmLawed.php</b> on line <b>181</b><br />
I think it's something wrong with my php version as here:
https://datatables.net//forums/discussion/comment/85059/#Comment_85059
I can't update it. How can I do?
Thanks
Pat
https://datatables.net/reference/event/responsive-display
I'm having a issue where the ajax reload function is causing the datatables responsive plugin to close the open row details.
table.ajax.reload( null, false );
I'm aware of a workaround for select2 fields by listening for the ajax request (below) and I am confident I'll have to use this approach with this issue.
table.on('xhr.select2Fix', function(){
My question is can I trigger the responsive plugin to open a row ID manually (for my problem here I can simply record the rowID on this event)
table.on( 'responsive-display', function ( e, datatable, row, showHide, update ) {
or do I only have the option of using the button beside the row to toggle the expansion/retraction of the responsive display?
KeyTable attempts to retain focus when a table is redrawn. This behavior breaks if the row that had focus is no longer in the table after the draw.
An example scenario that breaks:
* your table contains a single row
* your table is configured to call ajax.reload() on a timer (every 10 secs)
* you select a cell using KeyTable
* someone else deletes the row that contains your selected cell
The next time the timer callback executes and the table is redrawn, KeyTable will go looking for the row and redraw the table like a mad man, eventually causing a stack overflow.
Hi,
I’m a licenced user and have been implementing DataTables and Editor for an internal project. I’ve prechecked the documentation / forums and can’t get my head around this issue.
I have a Editable datatable, which is loading JSON data successfully from the server.
JSON from server:
{
"data": [
{
"DT_RowId": "row_3",
"FUND_MANAGER": "Graham K4-D15 (Innocap Track)",
"NO_MULTI_MGR_OR_PORT_ALPHA": "ABC",
"PERCENT_SUBINVESTMENT_GRADE": "DEF",
"BENCHMARK_DRIVEN": "",
"MINIMU_SIZE": "",
"UCITS_III": "",
"TOTAL_ASSETS_FUND": "",
"SCORE": "",
"COMMENT": ""},
{
"DT_RowId": "row_1",
"FUND_MANAGER": "SPDR Gold Tracker",
"NO_MULTI_MGR_OR_PORT_ALPHA": "",
"PERCENT_SUBINVESTMENT_GRADE": "",
"BENCHMARK_DRIVEN": "",
"MINIMU_SIZE": "",
"UCITS_III": "",
"TOTAL_ASSETS_FUND": "",
"SCORE": "",
"COMMENT": ""},
{
"DT_RowId": "row_2",
"FUND_MANAGER": "Transtrend (Innocap Track)",
"NO_MULTI_MGR_OR_PORT_ALPHA": "",
"PERCENT_SUBINVESTMENT_GRADE": "",
"BENCHMARK_DRIVEN": "",
"MINIMU_SIZE": "",
"UCITS_III": "",
"TOTAL_ASSETS_FUND": "",
"SCORE": "",
"COMMENT": ""}
],
"options": [],
"files": []
}
On inline editing a cell value and then clicking out, the AJAX request is sent and the server returns the expected JSON but the rows are not being updated. Instead, I get an error message: ‘A system error has occurred (More information)’ under the field taking me to: https://datatables.net/manual/tech-notes/12.
JSON returned:
Have tried returning the above JSON (using the same URL for param ajax: under editor), as well as the following:
{
"data": [
{
"DT_RowId": "row_3",
"FUND_MANAGER": "Graham K4-D15 (Innocap Track)",
"NO_MULTI_MGR_OR_PORT_ALPHA": "ABC",
"PERCENT_SUBINVESTMENT_GRADE": "DEF",
"BENCHMARK_DRIVEN": "GEF",
"MINIMU_SIZE": "",
"UCITS_III": "",
"TOTAL_ASSETS_FUND": "",
"SCORE": "",
"COMMENT": ""
}
]
}
Kind regards
I'm experimenting with the Scroller extension to see if I can use it a log message display. As new messages are added to the table the log window should scroll to the bottom (only if the user is not somewhere else in the display) to display the latest messages. The scrolling works with `table.row(':last').scrollTo(false);' but the problem is the Scroller doesn't always display the data. It seems that after a certain number of rows (100 maybe) the Scroller has problems displaying the data if the window is being scrolled.
Here is the test case. It starts out with 25 rows then the script adds 4 rows at a time at 1 second intervals. When it reaches ~80 rows the output changes to a 45 degree linear gradient. Scrolling above this then back down will properly display the rows.
Currently I have another method using things like $('.dataTables_scrollBody')[0].offsetHeight) and $('.dataTables_scrollBody').scrollTop() to control the scrolling. I wrote the code when I didn't understand anything about DT and JS and it has a memory leak. Instead of fixing it I was going to try Scroller for the API's available. If Scroller won''t work I will fix my original code.
Kevin
The date picker on IE and Firefox does not take into consideration the "scrollTop" value. This causes the datepicker to go to above the field when it does not need to be.
This can be fixed by doing the following:
Change _position function in DateTime:
var scrollTop = $('body').scrollTop();
To:
var scrollTop = $('body').scrollTop();
scrollTop = scrollTop > 0 ? scrollTop : $('html').scrollTop();
Can we please fix this on the next version?
Hi,
I am trying to check some condition before allow user to click "New" button
Editor.on('initCreate', function () {
if (SelectStatus !== 'Y') {
alert("Pleae Select !!!!!!");
return false;
}
else
return true;
});
I am getting alert but after alert it shows Lightbox for adding new record.
How to prevent show the lightbox dialog if condition not match ??
Hi,
I added export to excel button in datatable. but sometimes after downloading excel it cant open it and gives error "excel found unreadable content in xxxx.xlsx. Do you want to recover content of this file". I cant find for which character it is giving this error.
How to resolve it.
Thanks.
I'm pondering whether it is possible to replace the Select and KeyTable plugins with a unified code model that takes advantage of sequential focus navigation (tabindex navigation).
Here is a quick demo: https://jsfiddle.net/sliekens/5wvhr7o8/
The demo has a tabindex attribute on things that I want to be able to select, and some styling to make focused rows and cells stand out.
Before I go on and spend too much time on this, has anyone tried to go down this road before?
I am attempting to check/uncheck a checkbox that is a column on each row. If I examine $('#grid').DataTable().rows().nodes(), this only returns the rows that are visible on the current page. Of course if I examine $('#grid').DataTable().rows(), this returns the indexes of all rows. It appears that I have to use the nodes method to actually manipulate the DOM.
Do I have to loop through all of the rows to do this?
Is there a way an easier way to check/uncheck all of the results on all pages?
Thanks.
Hello,
I apologize if this is a repeat but I was not able to find a solution in my search.
I am populating my datatable dynamically through an object. The html is static with an empty body. The date I am sending back from the server is in this format (string) and the format I need it to display in:
01/26/2017 07:00:12 AM // MM/DD/YYYY HH:MM:SS 12
Here is how I am loading the data into the datatable:
// For each row, add data dynamically to table
$.each(transactionDetails, function(index, item) {
table.row.add([
item.applicationName,
item.apiName,
item.transactionId,
item.reqTimeStamp, // This is the date string
});
// Redraw the table
table.draw();
When I want to sort the date, its sorted in string format (from left to right) and this causes incorrect sorting.
How can I sort the date correctly while displaying it in the above format?
Thanks in advance.
Sanel
Hi,
Am new to .Net web application, datatables and editor. I went through the basic examples in the website. I am facing an issue. Hope someone can throw some light on this.
Please find below the code that i use and error message i get.
HTML:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="xxx.cs" Inherits="xxx" %>
<!DOCTYPE html>
<html>
<head runat="server">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- end required meta tags -->
<title>test</title>
<link href="../DataTables/Bootstrap-3.3.7/css/bootstrap.css" rel="stylesheet" type="text/css" /><!-- Do not edit -->
<link href="../DataTables/Bootstrap-3.3.7/css/bootstrap-theme.css" rel="stylesheet" type="text/css" /><!-- Define theme changes here. -->
<link href="../DataTables/DataTables-1.10.13/css/dataTables.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../DataTables/Buttons-1.2.4/css/buttons.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../DataTables/Select-1.2.0/css/select.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../DataTables/Editor-1.6.1/css/editor.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../Styles/test.css" rel="stylesheet" type="text/css" />
<script src="../DataTables/datatables.min.js" type="text/javascript"></script>
<script src="../Scripts/test.js" type="text/javascript"></script>
<!-- End JavaScript Includes -->
</head>
<body>
| col1 | col2 | col3 | col4 | col5 |
|---|
</body>
</html>
Javascript:
(function () {
var editor;
$(document).ready(function () {
editor = new $.fn.dataTable.Editor({
ajax: {
url: "URL to DB service",
contentType: "application/json; charset=utf-8",
dataType: "json" },
table: "#Grid-01",
fields: [
{
"label": "col 1",
"name": "col1"
},
{
"label": "col 2",
"name": "col2"
},
{
"label": "col 3",
"name": "col3"
},
{
"label": "col 4",
"name": "col4"
},
{
"label": "col 5",
"name": "col5"
}
],
formOptions: {
inline: {
onBlur: 'submit' }
}
});
var table = $('#Grid-01').DataTable({
lengthChange: false,
order: [],
ajax: {
url: "URL to DB service",
contentType: "application/json; charset=utf-8",
dataType: "json",
type: "GET",
dataSrc: "d"
},
columns: [
{ "data": "col1" },
{ "data": " col2" },
{ "data": " col3" },
{ "data": " col4" },
{ "data": " col5" }
]
});
// Display the buttons
new $.fn.dataTable.Buttons(table, [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]);
//Add the buttons to the appropriate Bootstrap class
table.buttons().container()
.appendTo($('.col-sm-6:eq(0)', table.table().container()));
$('#Grid-01').on('click', 'tbody td:not(:first-child)', function (e) {
editor.inline(this);
});
});
} ());
Output of DB service:
{"d":"[{\"col1\":\"12345\",\"col2\":\"123\",\"col3\":\"123\",\"col4\":\"100\",\"col5\":\"test_1]"}
Error message :
Datables warning: table id = Grid-01 – Requested unknown parameter ‘col1’ for row 0, column 0.
Thanks!
I'm installing DataTables Bootstrap styling via Bower, and the /images directory that contains the sort images (sort_asc.png, etc.) is missing from the package.
A similar issue is here that was resolved for the Foundation styling:
https://datatables.net//forums/discussion/comment/85008/
If they are the same images for all stylings, perhaps they should be included in the 'datatables.net' package rather than in the styling packages.
When I define my column like this
{ data: "ReviewDate", type: "date", render: $.fn.dataTable.render.moment("DD-MM-YYYY","YYYY-MM-DD","en")
I always get "invalid date" returned.
I am attempting to use the Responsive extension for DataTables, and I notice that until I added order: to the DataTables object, the responsive column wouldn't show properly (would ignore the orderable: object on columnDefs for the responsive control column).
See my example here: http://live.datatables.net/yajamuvo/1/edit?html,js,output
(Mind, for some reason the responsive controls is not working here either, despite having invoked it correctly from what I can tell, but you can remove the order: object, and the responsive column does not display correctly.)
This is a bit frustrating, since in some cases I want my query output (what populates my DataTable) to determine the default sort order. Not a deal-breaker, but if this is a bug and can be resolved, all the better.
On a side note, I notice the documentation for responsive makes mention of a no-wrap class to be added optionally to the table - this is not correct, as the correct class is actually nowrap (minus the hyphen).
I've gotten a link to show that the output isn't working with the reference to "moment" -
This "Column sorting Version 5" shows that the sorting on the columns work when the "$.fn.dataTable.moment('MMM-DD-YY') " is commented out, but this "Column sorting Version 4" isn't working with that same line uncommentted. I'm not for sure what I'm not doing correctly, but something isn't correct.
Note when you go to "Column Version 5" - the actual sorting on the dates are not correct - you'll see dates for 2016 mixed with 2017 down the list. The goal is to get this to sort on date in descending order.
Thanks, Michael
PS: If you need more information, please let me know what is missing and I'll see if I can get that info ASAP.
Hi,
I am looking for hints how to do the following. Thanks in advance.
In this example link, I would like to have the Modify date automatically set to current date after the row is created or edited, without including it in the edit form.
Is it possible (and how should I go about it)?
I have a table where the column headers are date ranges smilar to what is shown in the image attached (The image is from an older version).
I want to use arrows to load previous or later dateranges (so even the headers will change dynamically) and maybe add a date range filter. Also would it be possible to add a 'blank' column between the date ranges that are not continuous (there are dates between them that belong to neither date range)?
How should I go about this?
Can anyone point me to example where we can fetch data as datatable is scrolled?
I can see that it fetches all the data at once not as it is getting scrolled.
Hi Support,
I have slno unique key auto increment mysql table field.
I want to update row using editor using slno but do not want to display slno in table . can i use idSRC for this purpose or any other way to do this.
Regards.
Sunil