phpmyadmin / phpmyadmin/phpmyadmin
Uncaught Error: cannot call methods on draggable prior to initialization; attempted to call method 'destroy'
Open
Nobody has claimed this yet.
affects/6.0
Bug
confirmed/6.0
help wanted
- Dominant language
- PHP
- Stars
- 7.9k
- Forks
- 3.6k
- Avg merge
- 4d 18h
- Merged PRs (30d)
- 36
Description
Describe the bug
Uncaught Error: cannot call methods on draggable prior to initialization; attempted to call method 'destroy', when tring to edit another polygon from another row, with OpenStreetMaps as base layer disabled.
To Reproduce
Steps to reproduce the behavior:
- Go to https://demo.phpmyadmin.net/master-config/public/index.php?route=/sql&db=opengis&table=world_borders&server=1
- Click on
Edit - Click on
Edit/Insert - Disable
Use OpenStreetMaps as Base Layer - Close modal
- Go to
world_borderstable - Click on
Edit - Click on
Edit/Insert - See error
Expected behavior
No error should be given, and the Edit modal should open.
Screenshots
https://github.com/user-attachments/assets/331f6e97-f3a8-4d1e-b83a-74019f7a016c
Server configuration
- phpMyAdmin version: 6.0.0-dev
Additional context
{
"pma_version": "6.0.0-dev",
"browser_name": "FIREFOX",
"browser_version": "131.0",
"user_os": "Win",
"server_software": "nginx/1.14.2",
"user_agent_string": "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:131.0) Gecko/20100101 Firefox/131.0",
"locale": "en",
"configuration_storage": "enabled",
"php_version": "8.2.20",
"script_name": "index.php",
"exception_type": "js",
"exception": {
"mode": "stack",
"name": "Error",
"message": "cannot call methods on draggable prior to initialization; attempted to call method 'destroy'",
"stack": [
{
"func": "error",
"line": "2",
"column": "2741",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "V.widget.bridge/V.fn[o]/<",
"line": "6",
"column": "2230",
"context": [
"/*! jQuery UI - v1.13.3 - 2024-04-26",
"* https://jqueryui.com",
"* Includes: widget.js, position.js, data.js, disable-selection.js, effect.j//...",
"* Copyright OpenJS Foundation and other contributors; Licensed MIT */",
"",
"!function(t){\"use strict\";\"function\"==typeof define&&define.amd?define([\"jq//..."
],
"uri": "js/vendor/jquery/jquery-ui.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery-ui.min.js"
},
{
"func": "each",
"line": "2",
"column": "3129",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "each",
"line": "2",
"column": "1594",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "V.widget.bridge/V.fn[o]",
"line": "6",
"column": "1969",
"context": [
"/*! jQuery UI - v1.13.3 - 2024-04-26",
"* https://jqueryui.com",
"* Includes: widget.js, position.js, data.js, disable-selection.js, effect.j//...",
"* Copyright OpenJS Foundation and other contributors; Licensed MIT */",
"",
"!function(t){\"use strict\";\"function\"==typeof define&&define.amd?define([\"jq//..."
],
"uri": "js/vendor/jquery/jquery-ui.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery-ui.min.js"
},
{
"func": "unbindEvents",
"line": "169",
"column": "279",
"context": [
" });",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(this.target).on('dragstar//...",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(window).on('resize', this//...",
" }",
" unbindEvents() {",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(this.svgEl).off('dblclick//...",
" this.svgEl.removeEventListener('wheel', this.boundOnMouseWheel);",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(this.target).off('dragsta//...",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(window).off('resize', thi//...",
" }",
" onDragStart(event, dd) {"
],
"uri": "js/dist/table/gis_visualization.js?",
"scriptname": "js/dist/table/gis_visualization.js"
},
{
"func": "dispose",
"line": "153",
"column": "10",
"context": [
" show() {",
" super.show();",
" this.resize();",
" }",
" dispose() {",
" this.unbindEvents();",
" super.dispose();",
" }",
" bindEvents() {",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(this.svgEl).on('dblclick'//...",
" cursor: 'move',"
],
"uri": "js/dist/table/gis_visualization.js?",
"scriptname": "js/dist/table/gis_visualization.js"
},
{
"func": "dispose",
"line": "415",
"column": "19",
"context": [
" * Cleanup events when no longer needed",
" */",
" dispose() {",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(document).off('click', '#//...",
" if (this.svgVis) {",
" this.svgVis.dispose();",
" }",
" if (this.olVis) {",
" this.olVis.dispose();",
" }",
" }"
],
"uri": "js/dist/table/gis_visualization.js?",
"scriptname": "js/dist/table/gis_visualization.js"
},
{
"func": "disposeGISEditorVisualization",
"line": "26",
"column": "29",
"context": [
" */",
"let gisEditorLoaded = false;",
"let visualizationController;",
"function disposeGISEditorVisualization() {",
" if (visualizationController) {",
" visualizationController.dispose();",
" visualizationController = undefined;",
" }",
"}",
"/**",
" * Initialize the visualization in the GIS data editor."
],
"uri": "js/dist/gis_data_editor.js?v=6.0.0-dev",
"scriptname": "js/dist/gis_data_editor.js"
},
{
"func": "49/loadGISEditor/<",
"line": "188",
"column": "5",
"context": [
" jquery__WEBPACK_IMPORTED_MODULE_0___default().post('index.php?route=/gis-//...",
" if (typeof data === 'undefined' || data.success !== true) {",
" (0,_modules_ajax_message_ts__WEBPACK_IMPORTED_MODULE_3__.ajaxShowMess//...",
" return;",
" }",
" disposeGISEditorVisualization();",
" $gisEditorModal.find('.modal-title').first().html(data.gis_editor_title);",
" $gisEditorModal.find('.modal-body').first().html(data.gis_editor);",
" initGISEditorVisualization(JSON.parse(jquery__WEBPACK_IMPORTED_MODULE_0//...",
" const gisData = jquery__WEBPACK_IMPORTED_MODULE_0___default()('#gis_dat//...",
" if (gisData) {"
],
"uri": "js/dist/gis_data_editor.js?v=6.0.0-dev",
"scriptname": "js/dist/gis_data_editor.js"
},
{
"func": "c",
"line": "2",
"column": "25304",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "fireWith",
"line": "2",
"column": "26053",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "l",
"line": "2",
"column": "77782",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "send/o/<",
"line": "2",
"column": "80265",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "EventHandlerNonNull*send",
"line": "2",
"column": "80451",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "ajax",
"line": "2",
"column": "76167",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "?",
"line": "2",
"column": "4771",
"context": [
"/*! jQuery Migrate v3.5.0 | (c) OpenJS Foundation and other contributors | //...",
"\"undefined\"==typeof jQuery.migrateMute&&(jQuery.migrateMute=!0),function(t)//...",
"//# sourceMappingURL=jquery-migrate.min.map"
],
"uri": "js/vendor/jquery/jquery-migrate.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery-migrate.min.js"
},
{
"func": "a/e[t]",
"line": "2",
"column": "1582",
"context": [
"/*! jQuery Migrate v3.5.0 | (c) OpenJS Foundation and other contributors | //...",
"\"undefined\"==typeof jQuery.migrateMute&&(jQuery.migrateMute=!0),function(t)//...",
"//# sourceMappingURL=jquery-migrate.min.map"
],
"uri": "js/vendor/jquery/jquery-migrate.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery-migrate.min.js"
},
{
"func": "ce[i]",
"line": "2",
"column": "78232",
"context": [
"/*! jQuery v3.7.1 | (c) OpenJS Foundation and other contributors | jquery.o//...",
"!function(e,t){\"use strict\";\"object\"==typeof module&&\"object\"==typeof modul//...",
""
],
"uri": "js/vendor/jquery/jquery.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/jquery/jquery.min.js"
},
{
"func": "loadGISEditor",
"line": "183",
"column": "49",
"context": [
" 'type': type,",
" 'input_name': inputName,",
" 'ajax_request': true,",
" 'server': _modules_common_ts__WEBPACK_IMPORTED_MODULE_2__.CommonParams.//...",
" };",
" jquery__WEBPACK_IMPORTED_MODULE_0___default().post('index.php?route=/gis-//...",
" if (typeof data === 'undefined' || data.success !== true) {",
" (0,_modules_ajax_message_ts__WEBPACK_IMPORTED_MODULE_3__.ajaxShowMess//...",
" return;",
" }",
" disposeGISEditorVisualization();"
],
"uri": "js/dist/gis_data_editor.js?v=6.0.0-dev",
"scriptname": "js/dist/gis_data_editor.js"
},
{
"func": "openGISEditor",
"line": "214",
"column": "18",
"context": [
" * @param type geometry type",
" * @param inputName name of the input field",
" */",
"function openGISEditor(value, field, type, inputName) {",
" if (gisEditorLoaded) {",
" loadGISEditor(value, field, type, inputName);",
" } else {",
" loadJSAndGISEditor(loadGISEditor.bind(this, value, field, type, inputName));",
" }",
"}",
"/**"
],
"uri": "js/dist/gis_data_editor.js?v=6.0.0-dev",
"scriptname": "js/dist/gis_data_editor.js"
},
{
"func": "83/</<",
"line": "521",
"column": "12",
"context": [
" const field = button.parents('tr').children('td').first().find('input[t//...",
" // Column type",
" const type = button.parents('tr').find('span.column_type').text();",
" // Names of input field and null checkbox",
" const inputName = button.parent('td').children('input[type=\\'text\\']').//...",
" window.openGISEditor(value, field, type, inputName);",
" });",
" /**",
" * Forced validation check of fields",
" */",
" jquery__WEBPACK_IMPORTED_MODULE_0___default()(document).on('click', 'inpu//..."
],
"uri": "js/dist/table/change.js?v=6.0.0-dev",
"scriptname": "js/dist/table/change.js"
},
{
"func": "trigger",
"line": "6",
"column": "5502",
"context": [
"/*!",
" * Bootstrap v5.3.3 (https://getbootstrap.com/)",
" * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/boot//...",
" * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)",
" */",
"!function(t,e){\"object\"==typeof exports&&\"undefined\"!=typeof module?module.//...",
"//# sourceMappingURL=bootstrap.bundle.min.js.map"
],
"uri": "js/vendor/bootstrap/bootstrap.bundle.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/bootstrap/bootstrap.bundle.min.js"
},
{
"func": "show",
"line": "6",
"column": "51861",
"context": [
"/*!",
" * Bootstrap v5.3.3 (https://getbootstrap.com/)",
" * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/boot//...",
" * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)",
" */",
"!function(t,e){\"object\"==typeof exports&&\"undefined\"!=typeof module?module.//...",
"//# sourceMappingURL=bootstrap.bundle.min.js.map"
],
"uri": "js/vendor/bootstrap/bootstrap.bundle.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/bootstrap/bootstrap.bundle.min.js"
},
{
"func": "toggle",
"line": "6",
"column": "51805",
"context": [
"/*!",
" * Bootstrap v5.3.3 (https://getbootstrap.com/)",
" * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/boot//...",
" * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)",
" */",
"!function(t,e){\"object\"==typeof exports&&\"undefined\"!=typeof module?module.//...",
"//# sourceMappingURL=bootstrap.bundle.min.js.map"
],
"uri": "js/vendor/bootstrap/bootstrap.bundle.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/bootstrap/bootstrap.bundle.min.js"
},
{
"func": "?",
"line": "6",
"column": "55514",
"context": [
"/*!",
" * Bootstrap v5.3.3 (https://getbootstrap.com/)",
" * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/boot//...",
" * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)",
" */",
"!function(t,e){\"object\"==typeof exports&&\"undefined\"!=typeof module?module.//...",
"//# sourceMappingURL=bootstrap.bundle.min.js.map"
],
"uri": "js/vendor/bootstrap/bootstrap.bundle.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/bootstrap/bootstrap.bundle.min.js"
},
{
"func": "n",
"line": "6",
"column": "4238",
"context": [
"/*!",
" * Bootstrap v5.3.3 (https://getbootstrap.com/)",
" * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/boot//...",
" * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)",
" */",
"!function(t,e){\"object\"==typeof exports&&\"undefined\"!=typeof module?module.//...",
"//# sourceMappingURL=bootstrap.bundle.min.js.map"
],
"uri": "js/vendor/bootstrap/bootstrap.bundle.min.js?v=6.0.0-dev",
"scriptname": "js/vendor/bootstrap/bootstrap.bundle.min.js"
}
],
"uri": "index.php?route=%2Ftable%2Fchange&where_clause=%60world_borders%60.%60ISO3%60+%3D+%27ABW%27&where_clause_signature=afd7f3956df0f134c4cb5f492866467943fbf592fcfbd949ee102500a2fbc938&clause_is_unique=1&sql_query=SELECT+%2A+FROM+%60world_borders%60&sql_signature=219657ea43a36b3d1003b5b6eed7a1aa363795e00939c1745901e8e4601db960&goto=index.php%3Froute%3D%2Fsql%26server%3D1&default_action=update"
}
}
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with js/dist/table/gis_visualization.js, especially unbindEvents() and dispose(), then follow disposeGISEditorVisualization() and loadGISEditor() in js/dist/gis_data_editor.js. Reproduce the modal sequence with OpenStreetMaps disabled and verify that reopening Edit/Insert produces no draggable initialization error and opens the modal normally.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, jquery
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100