Hi,
I am working with simple xml and i want to hide some html line using javascript.
I have a simple java script file how to make it work on splunk.
I am not that much into javascript.
do we need to add this:
require([
"splunkjs/ready!",
"splunkjs/mvc/simplexml/ready!"
], function(
Simple javascript code is like this :
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$(document).ready(function() {
$('.faq_question').click(function() {
if ($(this).parent().is('.open')){
$(this).closest('.faq').find('.faq_answer_container').animate({'height':'0'},500);
$(this).closest('.faq').removeClass('open');
}else{
var newHeight =$(this).closest('.faq').find('.faq_answer').height() +'px';
$(this).closest('.faq').find('.faq_answer_container').animate({'height':newHeight},500);
$(this).closest('.faq').addClass('open');
}
});
});
</script>
Sorry if this question sounds silly.
You can't add javascript directly to a Simple XML Dashboard. Create a file in $APP_HOME/appserver/static
, let's call it "dashboard.js". Place this code into it:
require( "jquery", function($) {
$(document).ready(function() {
$('.faq_question').click(function() {
if ($(this).parent().is('.open')){
$(this).closest('.faq').find('.faq_answer_container').animate({'height':'0'},500);
$(this).closest('.faq').removeClass('open');
}else{
var newHeight =$(this).closest('.faq').find('.faq_answer').height() +'px';
$(this).closest('.faq').find('.faq_answer_container').animate({'height':newHeight},500);
$(this).closest('.faq').addClass('open');
}
});
});
});
Once you have that in place with the correct permissions, restart Splunk web. This will pull the Javascript and work accordingly.
You can't add javascript directly to a Simple XML Dashboard. Create a file in $APP_HOME/appserver/static
, let's call it "dashboard.js". Place this code into it:
require( "jquery", function($) {
$(document).ready(function() {
$('.faq_question').click(function() {
if ($(this).parent().is('.open')){
$(this).closest('.faq').find('.faq_answer_container').animate({'height':'0'},500);
$(this).closest('.faq').removeClass('open');
}else{
var newHeight =$(this).closest('.faq').find('.faq_answer').height() +'px';
$(this).closest('.faq').find('.faq_answer_container').animate({'height':newHeight},500);
$(this).closest('.faq').addClass('open');
}
});
});
});
Once you have that in place with the correct permissions, restart Splunk web. This will pull the Javascript and work accordingly.
Additionally, look at https://splunkbase.splunk.com/app/1603/ for many more examples adding little snippets of JS to SimpleXML dashboards.