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!

Why You Can't Miss .conf25: Unleashing the Power of Agentic AI with Splunk & Cisco

The Defining Technology Movement of Our Lifetime The advent of agentic AI is arguably the defining technology ...

Deep Dive into Federated Analytics: Unlocking the Full Power of Your Security Data

In today’s complex digital landscape, security teams face increasing pressure to protect sprawling data across ...

Your summer travels continue with new course releases

Summer in the Northern hemisphere is in full swing, and is often a time to travel and explore. If your summer ...