I added a new js plugin jquery ui as: npm require jquery-ui-dist
added resources\assets\core\plugins\plugins.js
as:"node_modules/jquery-ui-dist/jquery-ui.js",
added resources\assets\core\plugins\plugins.scss
as:@import "~jquery-ui-dist/jquery-ui.theme.min.css";
my custom script for a page:
"use strict";
var showTracker = (function () {
const element = document.getElementById("myModal");
const modal = new bootstrap.Modal("#myModal");
const dialog = document.getElementsByClassName("modal-dialog");
return {
init: function () {
modal.show();
$(".modal-backdrop").remove();
$(dialog).draggable({
handle: ".modal-header",
});
},
};
})();
KTUtil.onDOMContentLoaded(function () {
showTracker.init();
});
show-tracker.js?8b2b:18 Uncaught TypeError: $(...).draggable is not a function
at Object.init (show-tracker.js?8b2b:18:23)
at eval (show-tracker.js?8b2b:26:17)
at Object.onDOMContentLoaded (scripts.bundle.js:6184:17)
at eval (show-tracker.js?8b2b:25:8)
at Object../resources/assets/extended/js/custom/tracker/show-tracker.js (show-tracker.js:19:1)
at __webpack_require__ (show-tracker.js:53:42)
at show-tracker.js:64:37
at show-tracker.js:66:12
Could you please use this as a workaround? Place it at the top in your custom script which has draggable js code.
require("jquery-ui-dist/jquery-ui");
thanks its working.