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

Sethu.Karthik

I have integrated Data-table using rails gem 'jquery-datatable-rails'. For Data-table editor I tried with rails gem 'jquery-datatable-editor-rails', but I came with the error gem is not found. So I go with plug-in to integrate Data-table simple editor by adding dataTables.editor.min. When I user the plug-in I got the following issue in console. Please help me what I have done wrong in here, If there is any better way to achieve in-line editor with data-table it will be helpful for me. Thanks in advance cheers!

Console error

uncaught exception: DataTables Editor - remote hosting of code not allowed. Please see http://editor.datatables.net for details on how to purchase an Editor license or download a trial version of Editor from https://editor.datatables.net/download
_
_TypeError: $.fn.dataTable.Editor is not a constructor

application.js
//= require jquery
//= require jquery_ujs
//= require jquery.min
//= require turbolinks
//= require dataTables/jquery.dataTables
//= require bootstrap.bundle.min
//= require bootstrap.min
//= require bootstrap.bundle.min.js
//= require dataTables.bootstrap4
//= require jquery.dataTables.min
//= require dataTables.buttons.min
//= require dataTables.select.min
//= require dataTables.editor.min
//= require jquery.easing.min
//= require tabledata
//= require sb-admin.min
_
My code for Data-table editor._

// Get record onchange of table name
var editor; // use a global for the submit and return data rendering in the examples
editor = new $.fn.dataTable.Editor({
"ajax": "/homes/edit_system_config",
"table": "#dataTable",
"fields": [{
"label": "Input:",
"name": "input"
}]
});
// New record
$('a.editor_create').on('click', function (e) {
e.preventDefault();
editor.create( {
title: 'Create new record',
buttons: 'Add'
});
});

// Edit record
$('#dataTable').on('click', 'a.editor_edit', function (e) {
  e.preventDefault();
  editor.edit( $(this).closest('tr'), {
  title: 'Edit record',
  buttons: 'Update'
  });
});

// Delete a record
$('#dataTable').on('click', 'a.editor_remove', function (e) {
e.preventDefault();
editor.remove( $(this).closest('tr'), {
title: 'Delete record',
message: 'Are you sure you wish to remove this record?',
buttons: 'Delete'
});
});

kthorngren

A forum search for that error will give the answer. Check out this thread:
https://datatables.net/forums/discussion/comment/120763/#Comment_120763

Kevin

Sethu.Karthik

Hi @kthorngren

Thanks for your response, the remote hosting issue is resolved but still I am getting -> TypeError: $.fn.dataTable.Editor is not a constructor

Thanks in advance.

kthorngren

Here are a couple threads that mention dataTables.editor.js is not being loaded.

https://datatables.net/forums/discussion/47075
https://datatables.net/forums/discussion/comment/117817/#Comment_117817

Have you verified that the web page is able to load the editor from the local files?

Kevin

jarrettj

Hi,

Good day.

I downloaded the example node js application. And the public/js/dataTables.editor.js file is empty? All it has is the comments on top of the file? Is that correct? There's nothing in the docs about replacing that file. So running npm start all the examples wont work and throw this error.

Regards.
JJ

allan

Odd! I've just downloaded the trial Node package myself and it appears to be okay. I've just removed your existing trial - could you try downloading it again please?

Thanks,
Allan