All Apps and Add-ons

Modal pop-up to show splunk query output not working on html button click?

sarvesh_11
Communicator

Hello Splunkers,

I have a HTML button on my splunk dashboard, i want a pop-up when i click that button. That Pop-up will have a splunk Query Output.

Please find my below code:

Button:

<html>
<button class="btn btn-primary button2" style="margin-left: 950px; margin-top: -75px; position: absolute;" token="button">Report Of Killed Processes</button>
</html>

Button.js

require([
'splunkjs/mvc/searchmanager',
'splunkjs/mvc/tableview',
'underscore',
'splunkjs/mvc',
'/static/app/abcd/Modal.js',
"splunkjs/mvc/simplexml/ready!"
], function(SearchManager,
TableView,
_,
mvc,
Modal)
{
$(".button2").on("click", function (e){
e.preventDefault()
console.log(e)

var myModal = new Modal("mod1", {
title: "Movie Details",
backdrop: true,
keyboard: false,
destroyOnHide: true,
type: 'wide'
});

myModal.body
.append($('<p>Please find the movie details below</p><div id="modal_dtl_tabl"></div>'));

$(myModal.$el).on("show", function() {
setTimeout(function() {
var epoch = (new Date).getTime()
var modal_movie_dtl_srch = new SearchManager({
id: "modal_tbl_srch" + epoch,
earliest_time: "@d",
latest_time: "now",
preview: true,
cache: false,
search: "|inputlookup kill_log.csv  |table *"
});
var myCustomtable = new TableView({
id: "modal_example-table" + epoch,
managerid: "modal_tbl_srch" + epoch,
pageSize: "10",
el: $("#modal_dtl_tabl")
}).render();
}, 300)
});
myModal.show();
})
});

 

Also i am using Modal.js from Splunk Dev For All, placed it in my app ABCD.

Now when i click the button, nothing happens.

Labels (3)
0 Karma
1 Solution

kamlesh_vaghela
SplunkTrust
SplunkTrust

@sarvesh_11 

Can you please check this app for working example? 

https://github.com/KamleshVaghela/splunk_dashboard_model_view_examples

I hope this will help you.

 

Thanks
KV
▄︻̷̿┻̿═━一   😉

If any of my reply helps you to solve the problem Or gain knowledge, an upvote would be appreciated.

 

View solution in original post

0 Karma

kamlesh_vaghela
SplunkTrust
SplunkTrust

@sarvesh_11 

Can you please check this app for working example? 

https://github.com/KamleshVaghela/splunk_dashboard_model_view_examples

I hope this will help you.

 

Thanks
KV
▄︻̷̿┻̿═━一   😉

If any of my reply helps you to solve the problem Or gain knowledge, an upvote would be appreciated.

 

0 Karma

sarvesh_11
Communicator

Thanks @kamlesh_vaghela , it was very helpful

Tags (1)
0 Karma
Career Survey
First 500 qualified respondents will receive a $20 gift card! Tell us about your professional Splunk journey.

Can’t make it to .conf25? Join us online!

Get Updates on the Splunk Community!

Community Content Calendar, September edition

Welcome to another insightful post from our Community Content Calendar! We're thrilled to continue bringing ...

Splunkbase Unveils New App Listing Management Public Preview

Splunkbase Unveils New App Listing Management Public PreviewWe're thrilled to announce the public preview of ...

Leveraging Automated Threat Analysis Across the Splunk Ecosystem

Are you leveraging automation to its fullest potential in your threat detection strategy?Our upcoming Security ...