- Splunk Answers
- :
- Using Splunk
- :
- Dashboards & Visualizations
- :
- JavaScript code is disappeared when the dashboard ...
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark Topic
- Subscribe to Topic
- Mute Topic
- Printer Friendly Page
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi,
I have a dashboard html tags inside.
My goal is to use custom JavaScript which replace the innerHTML text of on of my span elements.
When debugging the JS code, I can see that the value is replaced as I expected but after clicking on resume, it goes back to the old value like nothing happened.
require([
'jquery',
'splunkjs/mvc',
'splunkjs/mvc/simplexml/ready!'
], function($, mvc,) {
document.getElementById("myspan").innerHTML = "GOOGLE".link("www.google.com");
});
Does anyone know what's wrong?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
@shayhibah
Can you please try this?
require([
'jquery',
'splunkjs/mvc',
'splunkjs/mvc/simplexml/ready!'
], function($, mvc,) {
$(document).ready(function() {
var myVar = setTimeout(function(){ document.getElementById("myspan").innerHTML = "GOOGLE".link("www.google.com");
}, 2000);
});
});
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
@shayhibah
Can you please try this?
require([
'jquery',
'splunkjs/mvc',
'splunkjs/mvc/simplexml/ready!'
], function($, mvc,) {
$(document).ready(function() {
var myVar = setTimeout(function(){ document.getElementById("myspan").innerHTML = "GOOGLE".link("www.google.com");
}, 2000);
});
});
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
@kamlesh_vaghela
It works!
Can you please explain it?
And in addition, how can I set the value as fast as possible? there is a small delay..
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Well, Not sure but as per my understanding and experience, JavaScript extension (JavaScript file) is executing with the internal (Splunk's internal dashboard supported JavaScript files) dashboard JavaScript executes. We are injecting our code into dashboard using JavaScript extension So possibilities of code impact overriding is there. So here, I have used a trick and used $(document).ready(function() {..} and setTimeout to execute my code.
You can decrease the timer from 2000 to 1000 or less to minimize delay.
If you got your solution then can you please upvote and accept this answer to close this question?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi
It is working fine
<dashboard script="custom.js">
<row>
<panel>
<html>
<p>
<span id="myspan">test</span>
</p>
</html>
</panel>
</row>
</dashboard>
js:
require([
'jquery',
'splunkjs/mvc',
'splunkjs/mvc/simplexml/ready!'
], function($, mvc,) {
document.getElementById("myspan").innerHTML = "GOOGLE".link("http://www.google.com");
});
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
@vnravikumar
Thanks for your response.
For some reason, I am able to see that the page is rendered and my "GOOGLE" is disappeared.
Do you know what can cause this behavior?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Can you please check by clearing your browser cache
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
@vnravikumar
I already did it.
I noticed that it happens only when my html code inside the dashboard XML contains many other div and span tags .
For example:
<panel id="details_panel">
<title>General Information</title>
<html>
<div>
<span>
<b>ID: </b>$technique_id$</span>
</div>
<div>
<span>
<b>Tactics: </b>$technique_tactics$</span>
</div>
<div>
<span>
<b>Platform: </b>$technique_platform$</span>
</div>
<div>
<span>
<b>Permissions Required: </b>$technique_permissions_required$</span>
</div>
<div>
<span>
<b>Effective Permissions: </b>$technique_effective_permissions$</span>
</div>
<div>
<span>
<b>Data Sources: </b>$technique_data_sources$</span>
</div>
<div id="myspan"/>
<div>
<span>
<b>Contributors: </b>$technique_contributors$</span>
</div>
<div>
<span>
<b>Requires Network: </b>$technique_requires_network$</span>
</div>
<div>
<span>
<b>Version: </b>$technique_version$</span>
</div>
</html>
</panel>
Once the page is loaded, it seems that "myspan" is empty although that I am able to see its value during debugging process.
Introducing the 2024 SplunkTrust!
Introducing the 2024 Splunk MVPs!
Splunk Custom Visualizations App End of Life
