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!

Why You Can't Miss .conf25: Unleashing the Power of Agentic AI with Splunk & Cisco

The Defining Technology Movement of Our Lifetime The advent of agentic AI is arguably the defining technology ...

Deep Dive into Federated Analytics: Unlocking the Full Power of Your Security Data

In today’s complex digital landscape, security teams face increasing pressure to protect sprawling data across ...

Your summer travels continue with new course releases

Summer in the Northern hemisphere is in full swing, and is often a time to travel and explore. If your summer ...