When I log in to my WP site as Admin no problem to show the data from DataTable, but if I log in as Subscriber nothing works.
I only get this messages:
DataTables warning: table id=table_1 - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1
I have tried to understand how to fix it, but can't understand it.
Is there anyone that can give me a hand.....
↧
Help!!!
↧
What's the right way to use actionName to Integrate Editor with Wordpress?
I can get editor working beautifully outside of Wordpress. Within wordpress, I've determined that a clash with the 'action' variable is the problem. To isolate the problem, I've begun with a simple test of editor outside of wordpress using php on the server side. In this environment, if I include what wordpress needs me to include in the ajax call: data : { action : "get_posts"}, the XHR response returns this error:
Uncaught Exception: Unknown Editor action: get_posts in C:\xampp\htdocs\tests\DataTablesEditor\php\lib\Editor.php:111
If I add actionName : "editor" to the editor object in my javascript, the error persists. If I add ->actionName('editor') to the editor instance in my php, the error persists. I suspect I'm doing something wrong on the php side. (I'm on a local server, so I'm sorry that I can't give you a testable example with the server files.)
Here's everything I'm using in the test:
The HTML File (index.html):
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>DataTables Editor Test</title>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.6.1/css/buttons.dataTables.min.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/select/1.3.1/css/select.dataTables.min.css"/>
<link rel="stylesheet" type="text/css" href="css/generator-base.css">
<link rel="stylesheet" type="text/css" href="css/editor.dataTables.min.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/select/1.3.1/js/dataTables.select.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/dataTables.editor.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/posts.js"></script>
</head>
<body class="dataTables">
<div class="container">
<h1>DataTables Editor Test</h1>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="wp_posts" width="100%">
<thead>
<tr>
<th></th>
<th>Title</th>
<th>Date</th>
<th>Type</th>
</tr>
</thead>
</table>
</div>
</body>
</html>
The Javascript file (js/posts.js):
var editor; // use a global for the submit and return data rendering in the examples
(function($){
$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
actionName : "editor",
ajax: {
url: 'php/table.wp_posts.php',
method: "POST",
data : { action : "get_posts"}
},
table: "#wp_posts",
fields: [ {
label: "Title:",
name: "post_title"
}, {
label: "Date:",
name: "post_date"
}, {
label: "Type:",
name: "post_type"
}
],
formOptions: {
inline: {
onBlur: 'submit'
}
}
} );
var table = $('#wp_posts').DataTable( {
actionName : "editor",
dom: "Bfrtip",
ajax: {
url: 'php/table.wp_posts.php',
method: "POST",
data : { action : "get_posts" }
},
columns: [
{
data: null,
defaultContent: '',
className: 'select-checkbox',
orderable: false
},
{ data: "post_title" },
{ data: "post_date" },
{ data: "post_type" },
],
order: [ 1, 'asc' ],
keys: {
columns: ':not(:first-child)',
keys: [ 9 ],
editor: editor,
editOnFocus: true
},
select: {
style: 'os',
selector: 'td:first-child'
},
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]
} );
} );
}(jQuery));
The PHP File (php/table.wp_posts.php)
<?php
include( "lib/DataTables.php" );
use
DataTables\Editor,
DataTables\Editor\Field,
DataTables\Editor\Format,
DataTables\Editor\Mjoin,
DataTables\Editor\Options,
DataTables\Editor\Upload,
DataTables\Editor\Validate,
DataTables\Editor\ValidateOptions;
Editor::inst( $db, 'wp_posts', 'ID' )
->actionName('editor')
->fields(
Field::inst( 'post_title' ),
Field::inst( 'post_date' )
->validator( Validate::dateFormat( 'Y-m-d H:i:s' ) )
->getFormatter( Format::datetime( 'Y-m-d H:i:s', 'Y-m-d H:i:s' ) )
->setFormatter( Format::datetime( 'Y-m-d H:i:s', 'Y-m-d H:i:s' ) ),
Field::inst( 'post_type' )
)
->where( 'post_type', 'content' )
->where( 'post_status', 'publish' )
->debug( true )
->tryCatch( false )
->transaction( false )
->process($_POST)
->json();
The query is selecting 3 fields of my wordpress database from mySQL, and it works as long as I delete the actionName variables in the php and js and remove the action inside the data variable of the ajax call.
Thoughts? Thanks for any help you can offer me. (I'm thrilled with the possibilities of datatables for this project once I get over this hump!)
↧
↧
Event reference pages: preDraw and draw
Hi,
I think the documentation is slightly out of date as the events seem to be triggered on 'preDraw.dt' and 'draw.dt' rather than the versions without '.dt'.
Pre-draw page: https://datatables.net/reference/event/preDraw
Draw page: https://datatables.net/reference/event/draw
Regards,
Matthew
↧
There are two types of ordering. Can you add a third method to order?
For both types of ordering there are two icons. And for "sorting_disabled" there is some method to sort in default as "order": []
↧
One DT, 2 editor forms
Hi
The 1st editor form uses the standard create, edit and remove extensions but form #2 gets called from a custom button. DT and editor form #1 share the same Ajax method. Form #2 has a different Ajax method that should not refresh the DT as the data it handles is different background data the user can edit but not see directly via the DT. He needs to click the custom button to view and edit that data. The forms handle data across 2 different tables who share the same foreign key.
var editor2 = ModifyCustomerSubPackSNsAssociations_editor();
(DT code)
buttons: [
{ extend: 'create', editor: editor1 },
{ extend: 'edit', editor: editor1 },
{ extend: 'remove', editor: editor1 },
{
text: '@(lblo.lblAssociatedSNs)',
extend: 'edit', editor: editor2
}
],
Code for ModifyCustomerSubPackSNsAssociations_editor:
function ModifyCustomerSubPackSNsAssociations_editor() {
var editor = new $.fn.dataTable.Editor({
destroy: true,
ajax: {
url: '/CustomerSubsPacks/CRUDCustomerSubsPacksSNs/',
data: function ( d ) {
return $.extend( {}, d, {
intContTpe: intContTpe1
} );
},
type: 'POST',
async: true,
cache: false
},
table: '#tblDataTable',
fields: [
{
label: '',
name: 'CustomerSubsPacksSNs.id'
}, {
label: '@(lblo.lblServiceNumbers):', //cdr formats and price lists don't show ticked when opening editor
name: 'CustomerSubsPacksSNs[].id', //SNs
type: "checkbox"
}
]
});
return editor;
}
How do I reference editor2 correctly? The form opens but ajax method CRUDCustomerSubsPacksSNs never gets hit when form opens. Browser console does not throw any errors. Thanks.
↧
↧
Invoice using Datatables
Thanks a million to Allan!
Was able to perfect generate a invoice in invoice looking format dynamically.
↧
Clear [loadingRecords] message when exception happen
Hi everyone,
Currently I'm customizing the error message that pops up when some exception happen in the errorMode extension as code below:
$.fn.dataTable.ext.errMode = function (settings, helpPage, message) {
Message.failMessage("My customized error message...");
};
But there is one thing I also would like to customize.
When loading data and an exception happen, the dataTable will show whatever is been set here
language: {
loadingRecords: "Please wait - loading..."
}
and the dataTable keeps showing this message even after clicking on the popup.
My question is, how can I clean this message or give another message when an exception happen?
is there such a property like
language: {
loadingRecordsError: "Sorry! Error loading data."
}
Thank you very much in advance guys!
Regards,
Alex
↧
asp.net dev/production config file
Is there a way to have two config files? When I publish to dev I want to connect to a different SQL server than when I publish the app to production.
or do I just need to go in and edit the connection string each time I publish?
↧
use two or more tables from database in editor
I use codeigniter to create editor datatables, it was normal for one table, but when i use two tables, there problem in ajax, here is model.
public function getNdsar2020($post)
{
// Build our Editor instance and process the data coming from _POST
Editor::inst( $this->editorDb, 'ndsar2020' )
->fields(
Field::inst( 'no_ndsar' ),
Field::inst( 'tgl_ndsar' ),
// ->validator( Validate::dateFormat( 'd/m/y' ) )
// ->getFormatter( Format::dateSqlToFormat( 'd/m/y' ) )
// ->setFormatter( Format::dateFormatToSql( 'd/m/y' ) ),
Field::inst( 'surat' ),
Field::inst( 'tgl_surat' ),
Field::inst( 'keterangan' ),
Field::inst( 'hal' )
)
->process( $_POST )
->json();
}
public function getPelanggan2020($post)
{
// Build our Editor instance and process the data coming from _POST
Editor::inst( $this->editorDb, 'pelanggan_2020' )
->fields(
Field::inst( 'nama_pelanggan' ),
Field::inst( 'idpel' ),
Field::inst( 'tarif_lama' ),
Field::inst( 'daya_lama' ),
Field::inst( 'tarif_baru' ),
Field::inst( 'daya_baru' ),
Field::inst( 'jumlah' ),
Field::inst( 'alamat' ),
Field::inst( 'daerah_kerja' ),
Field::inst( 'kontak' )
)
->process( $_POST )
->json();
}
}
****and then here my editorlib.****
public function process($post)
{
// DataTables PHP library
require dirname(__FILE__).'/Editor-PHP-1.9.2/lib/DataTables.php';
//Load the model which will give us our data
$this->CI->load->model('Sar_model');
//Pass the database object to the model
$this->CI->Sar_model->init($db);
//Let the model produce the data
$this->CI->Sar_model->getNdsar2020($post);
//Let the model produce the data
$this->CI->Sar_model->getPelanggan2020($post);
}
i check the ajax load result with jsonlint, and here is the problem .
Would you give me solution ??
↧
↧
add buttons to multiple tables
I need to only show add/edit/delete buttons depending on the user permissions. I found the following post that seems will do the trick:
https://datatables.net/forums/discussion/comment/160764/#Comment_160764
however, I have multiple tables per page. Is there a way to add buttons multiple tables without hard coding the table names?
↧
Column width not working
Hi I have read the other posts in the forum. Did not find solution.
<--! Datatables spezific files:-->
<link href="~/datatables/dataTables.bootstrap.min.css" rel="stylesheet" />
<script src="~/datatables/jquery.dataTables.min.js"></script>
<script src="~/datatables/dataTables.bootstrap.min.js"></script>*
<div id="datatablestest" style="width: 460px;margin: 0 auto;">
<table id="datatableresult" class="table table-condensed table-striped table-bordered table-hover" cellspacing="0">
</table>
</div>
var daTable = $('#datatableresult').DataTable({
"ajax": {
"url": daUrl,
"dataSrc": ''
},
"autoWidth" : false,
"columns": [
{ data: "JourID", title: "JourID", width: '50px'},
{ data: "JourTime", title: "JourTime", width: '50px'},
{ data: "Zust1", title: "Zust1", width: '30px'},
{ data: "Dokname", title: "Dokname", width: '100px'},
{ data: "Doktype", title: "Doktype", width: '100px'},
{ data: "JourInhaltTextOnly", title: "JourInhaltTextOnly", width:'550px'},
],
"paging": false,
"scrollY": 400,
"scrollX": true,
});
Has no effect at all.
DataTables makes column width that have nothing to do with the set options.
Am I misunderstanding completely, how this works ?
Thanks for Info
Cheers, Michael
↧
how to use datatables.net in reactjs the proper way ?
recently, I'm mitigating from jquery to react, and I wanted to use datatables.net in reactjs, but it's not a good practice to use jquery in reactjs as react will always return to use it's virtual dom. so is there any documentation on how to use datatables.net in reactjs
↧
columns and columnDefs not working together
[Datatables 1.10.18]
Given the following snippet does not work. I get an error that says : Cannot set property '_DT_CellIndex' of undefined TypeError: Cannot set property '_DT_CellIndex' of undefined
let resultTable = $('table#results').DataTable( {
"dom": 'Bfrtip',
"columns": [
{ "name": "colPlant" },
{ "name": "colPartNum" },
{ "name": "colStatus" },
{ "name": "colCustomers" },
{ "name": "colComments" },
{ "name": "colAction" }
],
"columnDefs": [{ "bSortable": false,
"targets": [ "colCustomers", "colComments"]}
]
});
I'm trying to set the names of the columns so I can use those names in the targets to make updating in the future easier.
Meanwhile, this works:
let resultTable = $('table#results').DataTable( {
"dom": 'Bfrtip',
"columnDefs": [{ "bSortable": false, "targets": [ 3, 4]} ]
});
Can anyone advise what I'm doing wrong? Is the syntax wrong? Can you use columns and columnDefs in the datatable instantiation like that or are you supposed to use them separately?
↧
↧
Update fields with PHP session variables
Hello!
I want to create a system to track when a record is created and modified. I have created all of the fields needed and made them read only so they can't be changed, I just can't seem to figure out the rest.
I'm using a ON UPDATE CURRENT_TIMESTAMP attribute for lastmodified, however I still need some way to handle the other three options.
I need to pass $_SESSION["username"] to the field createdby and the current time to createdat when a new entry is submitted.
I also need to pass $_SESSION["username"] to the field modifiedby whenever a change is made to a field.
Any suggestions on how this can be done easily?
↧
Searchpane issue with cascade and ajax reload
As mentioned in the Searchpane-feedback thread, there's a performance issue (pretty intense issue in fact), appearing when using cascading panes along with data.ajax.reload()
(see here for further details)
↧
Just out of curiosity (o;
Good evening
Saw the datatables supporter website here....where people can buy support credits and got mentioned either by name, text link or with a logo and a link...
Just have some thought about it if I should support datatables as well as editor...but....
How come that I see mostly dubios companies mentioned in the file of online casinos, financial and insurance companies?
Would I like to be mentioned with my logo/link in the same league as them?
Just my two cents (o;
cheers
richard
↧
Table not displaying correct answer. What am I doing wrong?
The code for my table is here http://live.datatables.net/jofuhaca/13/edit It runs on my pc but not on the live link, not sure why.
What I am trying to do, is collect api data on a loop and look for a difference in the 'price' object.
The code all runs on my pc except it appears to be calculating and displaying one row out. Console.log shows..
i 0 maintst.js:45:16
L 0.00000249 M 0.00000249 D -0.00000249 maintst.js:46:16
i 1 maintst.js:45:16
L 0.00001957 M 0.00001957 D -0.00001708 maintst.js:46:16
i 2 maintst.js:45:16
L 0.00000062 M 0.00000062 D 0.00001895 maintst.js:46:16
i 3 maintst.js:45:16
L 0.00000584 M 0.00000584 D -0.00000522 maintst.js:46:16
i 4 maintst.js:45:16
L 0.00000001 M 0.00000001 D 0.00000583
i is the counter, L is the lastPrice value M is the current price and D is the difference. What I am after using the first line as an example is for D to equal zero, what is happening is .00000249 is being subtracted from L (or M) 0.00001957 on the next iteration, (i =1) to give -0.00001708 when that too should be zero. I cannot fathom why this is happening. As previously mentioned, I am very new to this so have probably missed something very fundamental.
Thank you for your help
↧
↧
basic data table not work - may be browser settings?
Hi - this basic, 1st example, data table is not working.
It's the same one shown here http://live.datatables.net/, except everything is in one file,
as shown here: http://live.datatables.net/ciyefozi/1/edit
Tested in IE, FireFox, Chrome.
Did not work in Firefox or Chrome - table was displayed as if it had not gone through data table - just a plain un-formatted table..
In IE - it displayed the same way, but at the bottom of the screen it said: "Only Secure Content is displayed", and there was a button with the label "Display all Content". When I clicked the button, the data table was displayed as it should be.
I suspect that I need to change a ?browser? setting in the other browsers to allow the data table to work?
Does anyone know if that's correct & if so, what setting that would be?
Thanks!
-Carol
↧
I'm hardcode to all width for search input but does'nt work
This is code i use
<style>
.dataTables_info,
.dataTables_length {
font-size: 15px;
}
.dataTables_filter input {
width: 400px;
}
.dataTables_wrapper {
font-size: 15px;
}
<style>
all css working only .dataTables_filter input not working well
↧
How to create colspan on header with ajax loaded data
I'm trying to create colspan headers like the one shown in this example https://datatables.net/examples/basic_init/complex_header.html, but I want to do this programmatically using the DataTable initialization or API.
In my example below, I'm dynamically generating the column definitions directly from the json so I can avoid manually creating an html table in this same file. The code below works (although in real life the "my_data" value will come from an separate ajax call) but I can't figure out how to generate colspan. How can I programmatically generate the "HR Information" and "Contact" colspan items like https://datatables.net/examples/basic_init/complex_header.html,?
var my_data =
[
{
"name": "Tiger Nixon",
"position": "System Architect",
"salary": "$3,120",
"start_date": "2011/04/25",
"office": "Edinburgh",
"extn": 5421
},
{
"name": "Garrett Winters",
"position": "Director",
"salary": "5300",
"start_date": "2011/07/25",
"office": "Edinburgh",
"extn": "8422"
},
];
var my_columns = [];
function fillCols(dataSet) {
var x = dataSet[0];
$.each( x, function( key, value ) {
var my_item = {};
my_item.data = key;
my_item.title = key;
my_columns.push(my_item);
});
};
$(document).ready(function() {
fillCols(my_data)
$('#example').DataTable( {
data : my_data,
columns: my_columns
} );
} );
</script>
<table id="example" class="display" style="width:100%">
</table>
</html>
↧