7 tables on the same page
7 tables on the same page
Jacobairving
Posts: 2Questions: 1Answers: 0
in Editor
Hi, I have a page that's using the same data model for seven tables on the same razor-based html page. I'm doing the recommended initialization for the tables and the editor instances.
I'm using the latest version of DataTables and Editor. Has anyone tried this before?
Example:
const editor = new $.fn.dataTable.Editor({
ajax: function,
...
idSrc: 'SalesforceContactId',
table: '#companyLeadership',
display: 'envelope'
});
$('#companyLeadership').DataTable({
buttons: [
{ extend: 'create', editor },
{ extend: 'edit', editor },
{ extend: 'remove', editor },
...
});
const editor2 = new $.fn.dataTable.Editor({
ajax: function,
...
idSrc: 'SalesforceContactId',
table: '#corporateLeadership',
display: 'envelope'});
$('#corporateLeadership').DataTable({
buttons: [
{ extend: 'create', editor2 },
{ extend: 'edit', editor2 },
{ extend: 'remove', editor2 },
...});
When the page loads, all of the tables render correctly and the table using variable "editor" works. However, all of the other declared editor instances do not work. It appears there's an issue with the buttons. The page does not allow more than one instance of editor. Another strange issue is if I rename the first editor variable, editor1, and use that in the editor initialization, it breaks.
This question has an accepted answers - jump to answer
Answers
Looks like that should work. Here is an example with two Datatables.
What is the issue? What happens? Have you looked at the browser's console for errors?
What happens when it breaks?
Can you post a link to your page or test case replicating the issue so we can help debug?
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
Your buttons look wrong:
The key word "editor" is missing.
Don't know why your first editor works. Probably because it happens to be called "editor" ...
This is the correct syntax:
By the way you can also use multiple editors on one data table. Like in here:
Good catch @rf1234 I missed that
Kevin
Thank you! That was it. There aren't many examples of multiple tables and I didn't realize that convention of leaving the editor setting alone explicitly sets the editor name to "editor". Again, thanks!!
The buttons settings is an array of Javascript objects. In the above case
extendandeditorare the keys. HTH.Kevin
Another thing that took me years to understand is how you can refer to the respective editor in custom buttons. Here is a link:
https://datatables.net/forums/discussion/79491/soft-edit#latest
In this "action" statement I an refer to the respective data table as "dt" because it is passed in. But I can also refer to the respective Editor as "editor" because of this:
Based on that I can reuse my custom button with various data tables and editors without having to change the code.