select2 - Error adding field - unknown field type select2

eeight

Error messages shown:
Error adding field - unknown field type select2

Description of problem:
Paying customer using last version of the Editor. I tried to include multiple release of select2 from version 3 to 4 and rc. But the editor is not finding select2, I use it on the page without any issue. Anyone can help me investigation this?

allan

Sounds like you are missing the Select2 / Editor integration from here. It is basically a bridge between the two.

Allan

matteo.costantini

Hi,
i'm using https://editor.datatables.net/plug-ins/field-type/editor.select2 . I pay for editor license. i'm using laravel-mix but when compile the browser console show this message: Uncaught Error: Error adding field - unknown field type select2 .

My JS is this
/**
* First we will load all of this project's JavaScript dependencies which
* includes Vue and other libraries. It is a great starting point when
* building robust, powerful web applications using Vue and Laravel.
*/

require('./bootstrap');
require('@fortawesome/fontawesome-pro/js/all')

require('select2');
//require('select2/dist/js/i18n/en');
//require('select2/dist/js/i18n/it');

// DataTables
require('datatables.net-bs4');
require('datatables.net-autofill-bs4');
require('datatables.net-buttons-bs4');
//require('datatables.net-buttons/js/dataTables.buttons');

// JSZIP - For Excel export
window.JSZip = require('jszip');

// pdfMake - For PDF export
const pdfMake = require('pdfmake/build/pdfmake');
const pdfFonts = require('pdfmake/build/vfs_fonts');
pdfMake.vfs = pdfFonts.vfs
require('datatables.net-buttons/js/buttons.colVis');
require('datatables.net-buttons/js/buttons.flash');
require('datatables.net-buttons/js/buttons.html5');
require('datatables.net-buttons/js/buttons.print');
require('datatables.net-colreorder-bs4');
//require('datatables.net-editor-bs4');
require('@datatables.net/editor');
require('@datatables.net/editor-bs4');
require('datatables.net-fixedcolumns-bs4');
require('datatables.net-fixedheader-bs4');
require('datatables.net-keytable-bs4');
require('datatables.net-responsive-bs4');
require('datatables.net-rowgroup-bs4');
require('datatables.net-rowreorder-bs4');
require('datatables.net-scroller-bs4');
require('datatables.net-searchbuilder-bs4');
require('datatables.net-searchpanes-bs4');
require('datatables.net-select-bs4');
require('datatables.net-staterestore-bs4');
require('laravel-datatables-assets');
// DTE Fields
require('datatables.net-datetime');
require('./datatables.net-editor-fields/editor.select2');

//require('./datatables.net-editor-fields/editor.autoComplete.js');
//require('./datatables.net-editor-fields/editor.bootstrapDate.js');
//require('./datatables.net-editor-fields/editor.chosen.js');
//require('./datatables.net-editor-fields/editor.ckeditor4.js');
//require('./datatables.net-editor-fields/editor.ckeditor5.js');
//require('./datatables.net-editor-fields/editor.datetimepicker.js');
//require('./datatables.net-editor-fields/editor.datetimepicker-2.js');
//require('./datatables.net-editor-fields/editor.display.js');
//require('./datatables.net-editor-fields/editor.mask.js');
//require('./datatables.net-editor-fields/editor.qr.js');
//require('./datatables.net-editor-fields/editor.quill.js');
//require('./datatables.net-editor-fields/editor.selectize.js');
//require('./datatables.net-editor-fields/editor.tinymce.js');
//require('./datatables.net-editor-fields/editor.title.js');*/

allan

If you are getting that error with require('./datatables.net-editor-fields/editor.select2'); on the page then for some reason the plug-in isn't being added to the Editor field types object.

Can you link to me a page showing the issue so I can debug it fully please?

Thanks,
Allan

matteo.costantini

Unfortunately, I cannot provide a page, the one I published is in a restricted area and contains the latest working version. Moreover, it stopped working at a certain point... without any significant commits being made on the frontend code. Recommended NPM and node version?

allan

Node 12+ and any NPM version that supports that. Having said that, I doubt that the issue is the Node version based on the error message.

If you change

require('./datatables.net-editor-fields/editor.select2');

To:

const editorSelect2 = require('./datatables.net-editor-fields/editor.select2');

console.log(editorSelect2);

what does the console show as a result?

Allan

matteo.costantini

Uncaught TypeError: Cannot read properties of undefined (reading 'editorFields')

matteo.costantini

Can you help me, i'm very confused. what version of editor it's very tested with select2 plugin how integrate with CommonJS webpack??

karmendra

Did this ever got resolved, I am facing the very same issue, with CommonJs webpack

jtoler5

Getting the same Uncaught TypeError: Cannot read properties of undefined (reading 'editorFields')

allan

Sorry for the slow reply here. Could one of you create a minimal git repo showing the issue so I can attempt to debug it please? It must be something in the way that the file is being loaded.

Thanks,
Allan