jquery context menu in dashboard

[josephkverghese]

Hi,

I am trying to use a jquery plugin ( https://github.com/swisnl/jQuery-contextMenu ) to create a custom context menu on a splunk dashboard. my dashboard is in simplexml and uses the below to refer to the js and css files.

<dashboard refresh="30" script="test.js" stylesheet="test.css" hideFooter="true">   

The js file starts as below.

require([
    'underscore',
    '/static/app/app_name/jquery.contextMenu.js',
    'splunkjs/mvc',
    'splunkjs/mvc/tableview',
    'splunkjs/mvc/simplexml/ready!'
], function (_, $, mvc, TableView) {

I am getting the error net::ERR_ABORTED 404 (Not Found) for jquery.contextMenu.js

I have also tried {{SPLUNKWEB_URL_PREFIX}}/static/app/app_name/jquery.contextMenu.js and getting the same error.

Could someone please advise on the right way of loading a 3rd party library into the splunk dashboard ?

[niketn]

@josephkverghese can you try ?

 require([
     'underscore',
     'jquery',
     'jquery.contextMenu.js',
     'splunkjs/mvc',
     'splunkjs/mvc/tableview',
     'splunkjs/mvc/simplexml/ready!'
 ], function (_, $, 'JCM',mvc, TableView) {

Or else ./jquery.contextMenu.js in case above does not work?

[josephkverghese]

Hi Niket,

thanks much for taking the time to look into this. I tried both the approaches you mentioned, still getting the same error, as below. we are using Splunk Version 6.6.4.

For firefox the error is
Error: Script error for: jquery.contextMenu.js
http://requirejs.org/docs/errors.html#scripterror common.js line 248 > eval:166:17
makeError
https://xxxxxxxxxxxxxxxxx.com:1234/en-US/static/@7469810AD054F91F6F4812E6281DB48A48BEB52358E46355D3E... line 248 > eval:166:17
onScriptError
https://xxxxxxxxxxxxxxxx.com:1234/en-US/static/@7469810AD054F91F6F4812E6281DB48A48BEB52358E46355D3E9... line 248 > eval:1689:36

For chrome version 71.0.3578.98 the error is as below

VM3544:1903 GET https://xxxxxx.com:1234/en-US/app/nemoMonitorkv/jquery.contextMenu.js net::ERR_ABORTED 404 (Not Found)
req.load @ VM3544:1903
load @ VM3544:1647
load @ VM3544:828
fetch @ VM3544:818
check @ VM3544:848
enable @ VM3544:1151
enable @ VM3544:1519
(anonymous) @ VM3544:1136
(anonymous) @ VM3544:132
each @ VM3544:57
enable @ VM3544:1098
init @ VM3544:782
(anonymous) @ VM3544:1424
setTimeout (async)
req.nextTick @ VM3544:1763
localRequire @ VM3544:1413
requirejs @ VM3544:1745
shimmedRequirejsRequire @ common.js:247
(anonymous) @ nemon.js:5
globalEval @ common.js:14
(anonymous) @ dashboard.js:1
(anonymous) @ common.js:25
fire @ common.js:25
add @ common.js:25
(anonymous) @ common.js:25
each @ common.js:14
(anonymous) @ common.js:25
Deferred @ common.js:25
then @ common.js:25
(anonymous) @ dashboard.js:1
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
done @ common.js:26
(anonymous) @ common.js:27
load (async)
send @ common.js:27
ajax @ common.js:26
getScript @ dashboard.js:1
_loadScript @ dashboard.js:1
_loadExtension @ dashboard.js:1
loadScriptExtension @ dashboard.js:1
(anonymous) @ dashboard.js:226
_.each..forEach @ common.js:27
applyCustomExtension @ dashboard.js:226
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
deferred.(anonymous function) @ common.js:25
(anonymous) @ dashboard.js:10
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
deferred.(anonymous function) @ common.js:25
(anonymous) @ dashboard.js:71
(anonymous) @ common.js:25
fire @ common.js:25
add @ common.js:25
(anonymous) @ common.js:25
each @ common.js:14
(anonymous) @ common.js:25
Deferred @ common.js:25
then @ common.js:25
createVisualization @ dashboard.js:71
later @ common.js:27
setTimeout (async)
(anonymous) @ common.js:27
render @ dashboard.js:71
(anonymous) @ common.js:44
render @ dashboard.js:12
(anonymous) @ common.js:44
addElement @ dashboard.js:12
addChild @ dashboard.js:12
addChildToContainer @ dashboard.js:10
materializeComponent @ dashboard.js:10
materializeComponentFn @ dashboard.js:10
(anonymous) @ common.js:27
_.map..collect @ common.js:27
.(anonymous function) @ common.js:27
materializeComponents @ dashboard.js:10
materialize @ dashboard.js:10
applyDashboardStructure @ dashboard.js:226
later @ common.js:27
setTimeout (async)
(anonymous) @ common.js:27
triggerEvents @ common.js:29
trigger @ common.js:29
set @ common.js:29
parseDashboardXML @ dashboard.js:226
enter @ dashboard.js:226
_handleModeChange @ dashboard.js:222
(anonymous) @ common.js:25
fire @ common.js:25
add @ common.js:25
(anonymous) @ common.js:25
each @ common.js:14
(anonymous) @ common.js:25
Deferred @ common.js:25
then @ common.js:25
handleModeChange @ dashboard.js:222
triggerEvents @ common.js:29
trigger @ common.js:29
set @ common.js:29
(anonymous) @ dashboard.js:222
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
deferred.(anonymous function) @ common.js:25
(anonymous) @ common.js:47
(anonymous) @ common.js:47
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
deferred.(anonymous function) @ common.js:25
(anonymous) @ common.js:47
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
(anonymous) @ common.js:25
fire @ common.js:25
fireWith @ common.js:25
deferred.(anonymous function) @ common.js:25
(anonymous) @ common.js:47
execCb @ VM3544:1658
check @ VM3544:874
(anonymous) @ VM3544:1121
(anonymous) @ VM3544:132
(anonymous) @ VM3544:1164
each @ VM3544:57
emit @ VM3544:1163
check @ VM3544:925
enable @ VM3544:1151
init @ VM3544:782
(anonymous) @ VM3544:999
(anonymous) @ VM3544:132
finishLoad @ text.js:152
(anonymous) @ text.js:188
xhr.onreadystatechange @ text.js:299
XMLHttpRequest.send (async)
text.get @ text.js:307
load @ text.js:187
(anonymous) @ VM3544:1080
(anonymous) @ VM3544:132
on @ VM3544:513
callPlugin @ VM3544:942
fetch @ VM3544:818
check @ VM3544:848
enable @ VM3544:1151
(anonymous) @ VM3544:984
(anonymous) @ VM3544:132
(anonymous) @ VM3544:1164
each @ VM3544:57
emit @ VM3544:1163
check @ VM3544:925
enable @ VM3544:1151
init @ VM3544:782
callGetModule @ VM3544:1178
completeLoad @ VM3544:1552
onScriptLoad @ VM3544:1679
load (async)
req.load @ VM3544:1890
load @ VM3544:1647
load @ VM3544:828
fetch @ VM3544:818
check @ VM3544:848
enable @ VM3544:1151
enable @ VM3544:1519
callPlugin @ VM3544:1083
fetch @ VM3544:818
check @ VM3544:848
enable @ VM3544:1151
enable @ VM3544:1519
(anonymous) @ VM3544:1136
(anonymous) @ VM3544:132
each @ VM3544:57
enable @ VM3544:1098
init @ VM3544:782
(anonymous) @ VM3544:1424
setTimeout (async)
req.nextTick @ VM3544:1763
localRequire @ VM3544:1413
requirejs @ VM3544:1745
shimmedRequirejsRequire @ common.js:247
addToRegistry @ common.js:47
(anonymous) @ common.js:47
_addVisualizations @ common.js:47
(anonymous) @ common.js:47
fire @ common.js:25
fireWith @ common.js:25
done @ common.js:26
(anonymous) @ common.js:27
load (async)
send @ common.js:27
ajax @ common.js:26
Backbone.ajax @ common.js:29
Backbone.sync @ common.js:29
sync @ common.js:43
fetch @ common.js:29
fetch @ common.js:43
fetch @ common.js:43
fetch @ common.js:47
(anonymous) @ dashboard.js:4
fire @ common.js:25
fireWith @ common.js:25
done @ common.js:26
(anonymous) @ common.js:27
load (async)
send @ common.js:27
ajax @ common.js:26
Backbone.ajax @ common.js:29
Backbone.sync @ common.js:29
sync @ common.js:43
fetch @ common.js:29
fetch @ common.js:43
fetch @ common.js:43
(anonymous) @ common.js:405
(anonymous) @ common.js:27
get @ common.js:405
(anonymous) @ dashboard.js:4
(anonymous) @ dashboard.js:4
splunkjs/mvc/simplexml/element/base @ dashboard.js:4
__webpack_require_ @ common.js:1
(anonymous) @ dashboard.js:4
splunkjs/mvc/simplexml/dashboard/basepanel @ dashboard.js:4
webpack_require @ common.js:1
(anonymous) @ dashboard.js:4
splunkjs/mvc/simplexml/dashboard/panel @ dashboard.js:4
webpack_require @ common.js:1
(anonymous) @ dashboard.js:2
splunkjs/mvc/simplexml/dashboardview @ dashboard.js:2
webpack_require @ common.js:1
(anonymous) @ dashboard.js:1
splunkjs/mvc/simplexml @ dashboard.js:1
webpack_require @ common.js:1
(anonymous) @ dashboard.js:1
splunkjs/mvc/exposedModulesBase @ dashboard.js:1
webpack_require @ common.js:1
dashboard/exposedModules @ dashboard.js:1
webpack_require @ common.js:1
(anonymous) @ dashboard.js:55
dashboard/requirejsConfig @ dashboard.js:55
webpack_require @ common.js:1
0 @ dashboard.js:1
webpack_require @ common.js:1
window.webpackJsonp @ common.js:1
(anonymous) @ dashboard.js:1
VM3544:166 Uncaught Error: Script error for: jquery.contextMenu.js
http://requirejs.org/docs/errors.html#scripterror
at makeError (eval at module.exports (common.js:248), :166:17)
at HTMLScriptElement.onScriptError (eval at module.exports (common.js:248), :1689:36)