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!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...