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
Get Updates on the Splunk Community!

.conf24 | Registration Open!

Hello, hello! I come bearing good news: Registration for .conf24 is now open!   conf is Splunk’s rad annual ...

ICYMI - Check out the latest releases of Splunk Edge Processor

Splunk is pleased to announce the latest enhancements to Splunk Edge Processor.  HEC Receiver authorization ...

Introducing the 2024 SplunkTrust!

Hello, Splunk Community! We are beyond thrilled to announce our newest group of SplunkTrust members!  The ...