Dashboards & Visualizations
cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 
Ask a Question
Solved! Jump to solution

Insert html formated result in dashboard

mclane1
Path Finder
‎03-18-2021 10:42 AM

Hello, 

I want to explain clearly to others people what to do by use case.

I create a lookup  myLookup.csv :

Label, URL, Purposes, Actions
useCase1,myUrl1, purpose of the useCase1,"Do that and that and click on <a href=""link1"" target=""_blank"">link1</a>"
useCase2,myUrl2, purpose of the useCase2,"Do that and that and click on <a href=""link2"" target=""_blank"">link2</a>"
useCase3,myUrl3, purpose of the useCase3,"Do that and that and click on <a href=""link3"" target=""_blank"">link3</a>"

 

It's an exemple, in my case, I have some action more difficult.

My dashboard :

 

 

 

 

<form>
  <label>MyLabel</label>
  <row>
    <panel>
      <table>
        <title>Select one line</title>
        <search>
          <query>|inputlookup myLookup | table Label, URL, Purposes, Actions</query>
          <earliest>-15m</earliest>
          <latest>now</latest>
        </search>
        <option name="wrap">true</option>
        <option name="rowNumbers">false</option>
        <option name="drilldown">cell</option>
        <option name="dataOverlayMode">none</option>
        <option name="count">20</option>
        <drilldown>
          <set token="actions">$row.Actions$</set>
        </drilldown>
        <fields>["Label","URL","Purposes"]</fields>
      </table>
    </panel>
  </row>
  <row>
    <panel id="header_red">
      <title>My formated content</title>
      <html>
        <body>$actions$</body>
      </html>
    </panel>
  </row>
</form>

 

 

 

 

Result :

Do that and that and click on <a href=""link1"" target=""_blank"">link1</a>

😫

Labels (3)
Labels
Tags (1)
0 Karma
Reply
1 Solution
Solved! Jump to solution
Solution

mclane1
Path Finder
‎03-25-2021 04:05 AM

After some research we can add js by splunk.

It works, thank you.

<form script="convert_html_token1_to_divId_html_panel_with_token1.js">
  <label>TEST_HTML</label>
  <row>
    <panel>
      <table>
        <title>Select one line</title>
        <search>
          <query>|inputlookup muLookup | table Label, URL, Purposes, Actions</query>
          <earliest>-15m</earliest>
          <latest>now</latest>
        </search>
        <option name="wrap">true</option>
        <option name="rowNumbers">false</option>
        <option name="drilldown">cell</option>
        <option name="dataOverlayMode">none</option>
        <option name="count">20</option>
        <drilldown>
          <set token="actions">$row.Actions$</set>
          <set token="html_token1">$row.Actions$</set>
        </drilldown>
        <fields>["Label","URL","Purposes"]</fields>
      </table>
    </panel>
  </row>
  <row>
    <panel>
      <title>My formated content</title>
      <html>
        <body>$actions$
          <br/>to<br/>
          <div id="html_panel_with_token1"></div>
        </body>
      </html>
    </panel>
    <panel>
      <title>Javascript</title>
      <html>
        <iframe src="https://mySplunk/en-US/static/app/myApp/convert_html_token1_to_divId_html_panel_with_token1.js" height="200" width="1000" style="border:none;"></iframe>
      </html>
    </panel>
  </row>
</form>

 

Add file JS in : App->manage app->Find you App and "Edit Properties"->Upload asset

convert_html_token1_to_divId_html_panel_with_token1.js

require([
    'jquery',
    'splunkjs/mvc',
    'splunkjs/mvc/simplexml/ready!'
], function($, mvc,) {
    var submittedTokens = mvc.Components.get('submitted');
    // Listen for a change to the token html_token1 value
    submittedTokens.on("change:html_token1", function(model, html_token1, options) {
        var tokHTMLJS=submittedTokens.get("html_token1");
        if (tokHTMLJS!==undefined)
        {
            $("#html_panel_with_token1").html(tokHTMLJS);
        }
    });
});

You can see result in  https://mySplunk/en-US/static/app/myApp/convert_html_token1_to_divId_html_panel_with_token1.js

View solution in original post

0 Karma
Reply
Solved! Jump to solution
Solution

mclane1
Path Finder
‎03-25-2021 04:05 AM

After some research we can add js by splunk.

It works, thank you.

<form script="convert_html_token1_to_divId_html_panel_with_token1.js">
  <label>TEST_HTML</label>
  <row>
    <panel>
      <table>
        <title>Select one line</title>
        <search>
          <query>|inputlookup muLookup | table Label, URL, Purposes, Actions</query>
          <earliest>-15m</earliest>
          <latest>now</latest>
        </search>
        <option name="wrap">true</option>
        <option name="rowNumbers">false</option>
        <option name="drilldown">cell</option>
        <option name="dataOverlayMode">none</option>
        <option name="count">20</option>
        <drilldown>
          <set token="actions">$row.Actions$</set>
          <set token="html_token1">$row.Actions$</set>
        </drilldown>
        <fields>["Label","URL","Purposes"]</fields>
      </table>
    </panel>
  </row>
  <row>
    <panel>
      <title>My formated content</title>
      <html>
        <body>$actions$
          <br/>to<br/>
          <div id="html_panel_with_token1"></div>
        </body>
      </html>
    </panel>
    <panel>
      <title>Javascript</title>
      <html>
        <iframe src="https://mySplunk/en-US/static/app/myApp/convert_html_token1_to_divId_html_panel_with_token1.js" height="200" width="1000" style="border:none;"></iframe>
      </html>
    </panel>
  </row>
</form>

 

Add file JS in : App->manage app->Find you App and "Edit Properties"->Upload asset

convert_html_token1_to_divId_html_panel_with_token1.js

require([
    'jquery',
    'splunkjs/mvc',
    'splunkjs/mvc/simplexml/ready!'
], function($, mvc,) {
    var submittedTokens = mvc.Components.get('submitted');
    // Listen for a change to the token html_token1 value
    submittedTokens.on("change:html_token1", function(model, html_token1, options) {
        var tokHTMLJS=submittedTokens.get("html_token1");
        if (tokHTMLJS!==undefined)
        {
            $("#html_panel_with_token1").html(tokHTMLJS);
        }
    });
});

You can see result in  https://mySplunk/en-US/static/app/myApp/convert_html_token1_to_divId_html_panel_with_token1.js

0 Karma
Reply
Solved! Jump to solution

mclane1
Path Finder
‎03-19-2021 02:35 AM

Thank you very much for your quick answer.

Splunk is deployed in a production environment (unix) and requires root rights to be able to browse / edit / create files. Despite our a lot of attempts to change the rights, with each modification in the application (addition/update of a dashboard or other), the rights go back to root. It is therefore always complicated to ask a systems engineer to perform the manipulation with the ITIL standards that go with it.

Create Dashboard : less than 1 hour

Create a js file on splunk without the application : 3 days (we must ask to a lot of people and explain what we do many times)

https://en.wikipedia.org/wiki/ITIL

 

Tags (2)
0 Karma
Reply
Get Updates on the Splunk Community!

Adoption of RUM and APM at Splunk

    Unleash the power of Splunk Observability   Watch Now In this can't miss Tech Talk! The Splunk Growth ...

Routing logs with Splunk OTel Collector for Kubernetes

The Splunk Distribution of the OpenTelemetry (OTel) Collector is a product that provides a way to ingest ...

Welcome to the Splunk Community!

(view in My Videos) We're so glad you're here! The Splunk Community is place to connect, learn, give back, and ...