jQuery Datatable Editor not initializing

Question

I am currently using datatable in a page. However, when I try adding datatable editor plug-in, I am getting errors in the console:

TypeError: $.fn.dataTable.Editor is not a constructor

All I did was add the following lines in the jquery of creating a table:

 var table = $('#sampledt').DataTable();
 var editor = new $.fn.dataTable.Editor(table);
 new $.fn.dataTable.Buttons( table, [
  { 
    extend: "edit", editor: editor 
  },
  { 
    extend: "remove", editor: editor 
  }
]);

table.buttons().container()
     .appendTo( $('col-sm-6:eq(0)', table.table().container() ));

These are the .js and .css in the page:

jquery-1.12.0.min.js
bootstrap.min.js
jquery.dataTables.min.js
dataTables.bootstrap.min.js
dataTables.buttons.min.js
buttons.bootstrap.min.js
dataTables.select.min.js
dataTables.editor.min.js

bootstrap.min.css
dataTables.bootstrap.min.css
buttons.bootstrap.min.css
select.bootstrap.min.css
editor.bootstrap.min.css

Am I missing something? Thanks in advance.

UPDATE:

I added the var editor = new $.fn.dataTable.Editor(table); The console error of 'editor' not being defined was removed. Instead, a new error occurred: $.fn.dataTable.Editor is not a constructor.

UPDATE:

I removed the bootstrap.min.js from the page. The console error "TypeError: a.Editor is undefined" was removed.

Campestral

is the editor variable you assign to "edit" defined somewhere? how? – Hard

hello, I assigned it as: var editor = new $.fn.dataTable.Editor(sampledt); However, I got an error: $.fn.dataTable.Editor is not a constructor – Campestral

shouldn't it be editor() lowercase? – Hard

I changed it but unfortunately, the error is still there. T.T – Campestral

what kind of object is table you use to construct editor? – Hard

Answer 1

are you using file from a Free trial version? ensure that you have purchased the editor or get newer files within the trial period

Thekla

Answer 2

I guess you missed initialization. You need to initialize the variable editor and assign it the value like:

var editor = new $.fn.dataTable.Editor( {} );

Tiruchirapalli

hello, I assigned 'editor' in a dataTable.Editor as follows: var editor = new $.fn.dataTable.Editor(sampledt); However, I am having another error in console: $.fn.dataTable.Editor is not a constructor – Campestral

What is this editor.bootstrap.min.js file for? Can you remove it once and check – Tiruchirapalli

hello, I removed the editor.boostrap.min.js from the page. Now, the console "TypeError: a.Editor is undefined" was gone. I am now left with "TypeError: $.fn.dataTable.Editor is not a constructor" error – Campestral