topic Re: How to add a Splunk Report (saved search) inside the HTML tags? in Reporting

How to add a Splunk Report (saved search) inside the HTML tags?

saulcruzmendez — Thu, 07 Nov 2019 00:17:42 GMT

I have created inside an HTML tag a popup with the modal class.
However, I'm interested in showing a Report (saved search) on that popup.
I'm not sure how to add such a report inside the HTML tag.

        <div class="modal popup-body $tokShowModel$" id="myModal">
         <div class="modal-header popup-header">
            <h3>Show a report</h3>
            <div>
             <a id="anchorCloseModalWindow" class="btn btn-primary btn-position">x</a>
            </div>
         </div>
         <div class="modal-body">
         <h1>Report comes here<h1>
         </div>
        </div>

Re: How to add a Splunk Report (saved search) inside the HTML tags?

niketn — Thu, 07 Nov 2019 16:18:04 GMT

@saulcruzmendez, one simple approach would be to convert your saved search to scheduled search and enable Embedded Report (learn about the best practices to enable this).

https://docs.splunk.com/Documentation/Splunk/latest/Report/Embedscheduledreports

Then you can add the iframe code to your existing Modal Pop-up. Here is a sample code:

  <row>
    <panel>
      <html>
        <div class="modal popup-body $tokShowModel$" id="myModal">
          <div class="modal-header popup-header">
            <h3>Show a report</h3>
            <div>
              <a id="anchorCloseModalWindow" class="btn btn-primary btn-position">x</a>
            </div>
          </div>
          <div class="modal-body">
            <h1>Splunkd Error embedded as modal pop-up</h1>
            <div>
              <iframe height="400" width="480" frameborder="0" src="embedded_report_rest_uri_generated_after_converting_your_report_to_embedded_report"></iframe>
            </div>
          </div>
        </div>
      </html>
    </panel>
  </row>

Do try out and confirm.

Re: How to add a Splunk Report (saved search) inside the HTML tags?

saulcruzmendez — Thu, 07 Nov 2019 18:41:35 GMT

@niketnilay

Thanks you for your answer. That could work but I need it to be a search on real time, not a schedule report. I have been looking around, and from what is looks like. I need to work on the modal window via JavaScript.

Re: How to add a Splunk Report (saved search) inside the HTML tags?

saulcruzmendez — Fri, 08 Nov 2019 17:50:53 GMT

I was able to solve this via a Javascript, using a SearchManager and TableElement.

These links are pretty good documented:

https://docs.splunk.com/DocumentationStatic/WebFramework/1.0/compref_searchmanager.html
https://dev.splunk.com/enterprise/docs/developapps/webframework/displaydataview/howtoaddvisualhtml

Re: How to add a Splunk Report (saved search) inside the HTML tags?

niketn — Fri, 08 Nov 2019 18:52:50 GMT

@saulcruzmendez Go ahead and accept your own answer posted above. The reason why I had suggested Embedded Dashboards was to keep the complexity lower. However, if you are comfortable with Simple XML Extensions, you can try the following Splunk .Conf session by @jconger where Example 10 deals with Event Handler + Token + Table Cell Render + Modal + Splunk Web Framework to generate a chart as Modal pop-up exactly the same way as your requirement.

10 Tips, Tricks and Hacks for Better Dashboards in Splunk

Re: How to add a Splunk Report (saved search) inside the HTML tags?

saulcruzmendez — Fri, 08 Nov 2019 19:54:49 GMT

@niketnilay Thank you for the link! I'll for sure watch the video session. I appreciate the help!