Hi!
Have my own bundle including a mockup pattern and some JS and CSS resource files. One of them is jdatatables (current version). The JS and CSS resources are included into the bundle. But the jdatatables does not work when accessed from the mockup pattern code.
The bundle definition:
require([
'jquery', // We use jquery to search the DOM for pattern declarations.
'pat-registry', // We have to register
'mockup-patterns-inqbus_mailcenter_listview', // Depend on the patterns, you want to support in this bundle.
'inqbus_mailcenter_datatables',
'inqbus_mailcenter_jeditable',
'inqbus_mailcenter_datatables_editable'
], function($, Registry, inqbus_mailcenter_listview, Datatables, Jeditable, DatatablesEditable) {
'use strict';
if (window.parent === window) {
$(document).ready(function() {
if (!Registry.initialized) {
Registry.init();
}
});
}
});
The mockup code:
define([
'mockup-patterns-base',
'pat-registry',
'jquery',
'inqbus_mailcenter_datatables',
'inqbus_mailcenter_datatables_editable'
], function (Base, Registry, $, Datatables, DatatablesEditable) {
'use strict';
return Base.extend({
name: 'inqbus_mailcenter_listview',
trigger: '.pat-inqbus_mailcenter_listview', // has to be exact like this: 'pat-' + patternname.
parser: 'mockup',
init: function () {
/* data table config from the view */
var datastore = $('#datastore'),
/* Columns definition [JS Code so not qouted vie |safe]*/
aoColumnsDT = JSON.parse(datastore.attr('aocolumnsdt')),
/* URL to the AJAX view */
sAJAXSourceDT = datastore.attr('sajaxsourcedt'),
...
alert(Datatables);
/* define the data table base parameters */
var oTable = $('#browser-table').dataTable({
"bPaginate": true,
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": sAJAXSourceDT,
"aoColumns": aoColumnsDT,
"fnInitComplete": register_dblclick_handler,
"fnDrawCallback": register_dblclick_handler,
"sDom": 'T<"clear">lfrtip',
"oTableTools": {
"sSwfPath": "++resource++jquery.datatables/extras/TableTools/media/swf/copy_csv_xls_pdf.swf",
"sRowSelect": "multi",
"aButtons": ["select_all", "select_none"]
}
});
}); //End of init function.
The alert comes up with "Undefined" and the call to $('#browser-table').dataTable({ .. raises "dataTable is not a function".
I am aware that jdatatables interacts with registerJS. But obviously not in the way needed to use it from within a mockup pattern. This may be related to https://community.plone.org/t/again-dealing-with-3rd-party-js-modules-in-plone-5-is-a-major-pain/1269?u=volkerjaenisch but is also slightly different since I do not use any script-Tags in the page header since utilizing a mockup paterrn.
Any pointers appreciated
Volker