Splunk Search

how to add a link between title tags

jip31
Motivator

hi
I would like to know if it's possible to add an hyperlink between title tags

    <panel>
      <title>Crashes volume (%)</title>
Tags (1)
0 Karma
1 Solution

kamlesh_vaghela
SplunkTrust
SplunkTrust

@jip31

Can you please try this?

<dashboard script="myPanel.js">
  <label>Test Label</label>
  <row>
    <panel id="myPanel">
      <title>Test Title</title>
      <table>
        <search>
          <query>|stats count</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">none</option>
      </table>
    </panel>
  </row>
</dashboard>

myPanel.js

require([
        "splunkjs/mvc",
        "splunkjs/mvc/simplexml/ready!"
    ], function (
        mvc) {
        var title = $("#myPanel .panel-title").text();
        var link = "https://www.google.com";

        $("#myPanel .panel-title").html("<a target='_blank' href='"+link+"'>"+title+"</a>");
});

View solution in original post

0 Karma

vnravikumar
Champion

Hi

Give a try

<dashboard script="title.js">
  <label>Title</label>
  <init>
    <set token="url">http://google.com</set>
    <set token="label">Google</set>
  </init>
  <row>
    <panel id="test">
      <title>.</title>
      <table>
        <search>
          <query>index="_internal" |stats count</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
          <done>
            <set token="count">$result.count$</set>
          </done>
        </search>
        <option name="drilldown">none</option>
      </table>
    </panel>
  </row>

js:

require([
    "splunkjs/mvc",
    "splunkjs/mvc/simplexml/ready!",
], function(mvc) {
    $(document).ready(function () {
        var defaultTokenModel = mvc.Components.get("default");
        var url = defaultTokenModel.get("url");
        var label = defaultTokenModel.get("label");
        $('#test h2[class="panel-title"]').html('<a target="_blank" href="' + url +'">'+ label+'</a>');

    });
});
0 Karma

jip31
Motivator

thanks but its not possible directly in CSS??

0 Karma

kamlesh_vaghela
SplunkTrust
SplunkTrust

@jip31

Can you please try this?

<dashboard script="myPanel.js">
  <label>Test Label</label>
  <row>
    <panel id="myPanel">
      <title>Test Title</title>
      <table>
        <search>
          <query>|stats count</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">none</option>
      </table>
    </panel>
  </row>
</dashboard>

myPanel.js

require([
        "splunkjs/mvc",
        "splunkjs/mvc/simplexml/ready!"
    ], function (
        mvc) {
        var title = $("#myPanel .panel-title").text();
        var link = "https://www.google.com";

        $("#myPanel .panel-title").html("<a target='_blank' href='"+link+"'>"+title+"</a>");
});
0 Karma

jip31
Motivator

thanks but its not possible directly in CSS??

0 Karma

kamlesh_vaghela
SplunkTrust
SplunkTrust

Not sure. Bcoz, we are adding a link ( an anchor tag ) between title which is nearly not possible using CSS. We have to use some javascript.

0 Karma

jip31
Motivator

OK never mind.......

0 Karma
Get Updates on the Splunk Community!

Discover Powerful New Features in Splunk Cloud Platform: Enhanced Analytics, ...

Hey Splunky people! We are excited to share the latest updates in Splunk Cloud Platform 9.3.2408. In this ...

Splunk Classroom Chronicles: Training Tales and Testimonials

Welcome to the "Splunk Classroom Chronicles" series, created to help curious, career-minded learners get ...

Access Tokens Page - New & Improved

Splunk Observability Cloud recently launched an improved design for the access tokens page for better ...