Getting Data In

Custom javascript being overwritten by default Splunk default view (common.js)

sirajnp
Path Finder

I'm creating a new dashboard with custom layout/style in Splunk enterprise security app. I'm experiencing an issue while adding my custom.js script to dashboard. I have placed the custom.js file in splunkenterprisesecurity/appserver/static/custom.js. When I debug the script I can view that the script being loaded successfully and the layout & style being applied based on the condition. However when it exit from the inner function(function (newValue)) and go back to main function (common.js), Splunk removes all the custom styles applied by inner function based on the condition. Below is the code.

Any help is highly appreciated, not sure what I'm doing wrong.

Please note that the id #demo is correctly defined in the html class for the panel. As I said I can see it being applied in the debug mode.

custom.js

require([

      "splunkjs/mvc",
"splunkjs/mvc/simplexml/ready!",

], function (mvc)
{
console.log("inside");
var defaultTokenModel = mvc.Components.get("default");
defaultTokenModel.on("change:csi", function (newValue)
{
var csi = defaultTokenModel.get("csi");
if ((csi>=0) && (csi<=2.5))
{
$('#demo').removeClass('pan_yellow');
$('#demo').removeClass('pan_green');
$('#demo').addClass('pan_red');
}
else if ((csi>2.5) && (csi<=4))
{
$('#demo').removeClass('pan_red');
$('#demo').removeClass('pan_green');
$('#demo').addClass('pan_yellow');
}
else if ((csi>4) && (csi<=5))
{
$('#demo').removeClass('pan_yellow');
$('#demo').removeClass('pan_red');
$('#demo').addClass('pan_green');
}
});
});

css file.

.pan_red
{
background: #FE2B57 !important;
}

.pan_yellow
{
background: #FBAA49 !important;
}
.pan_green
{
background: #00ea77 !important;
}

0 Karma

sirajnp
Path Finder

Any inputs?

0 Karma
Get Updates on the Splunk Community!

What You Read The Most: Splunk Lantern’s Most Popular Articles!

Splunk Lantern is a Splunk customer success center that provides advice from Splunk experts on valuable data ...

See your relevant APM services, dashboards, and alerts in one place with the updated ...

As a Splunk Observability user, you have a lot of data you have to manage, prioritize, and troubleshoot on a ...

Index This | What goes away as soon as you talk about it?

May 2025 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with this month’s ...