Solved: Add a help panel to a dashboard?

dbcase · ‎08-21-2016

Hi,

I have a dashboard that I would like to add a "help" panel/text to. I'd like it to be hidden by default but when a user presses a button/radio button/something, the panel with the help instructions show up and then when the user is done the user would click inside the panel and it hides.

Is something like this possible?

martin_mueller · ‎08-21-2016

You could add an HTML panel that depends on a token, this token gets set by your button/radio button/something which in turn makes the depending panel appear.

<form>
  <fieldset submitButton="false">
    <input type="radio" token="dummy" searchWhenChanged="true">
      <label>Show Help:</label>
      <default>No</default>
      <choice value="No">No</choice>
      <choice value="Yes">Yes</choice>
      <change>
        <condition value="No">
          <unset token="showhelp" />
        </condition>
        <condition value="Yes">
          <set token="showhelp">awwwyeah</set>
        </condition>
      </change>
    </input>
  </fieldset>

  <row>
    <panel depends="$showhelp$">
      <html>
        <h1>
          HTML Panels
        </h1>
        <p>Easily add content to clarify use of a dashboard.</p>
      </html>
    </panel>
  </row>
</form>

View solution in original post

martin_mueller · ‎08-21-2016

You could add an HTML panel that depends on a token, this token gets set by your button/radio button/something which in turn makes the depending panel appear.

<form>
  <fieldset submitButton="false">
    <input type="radio" token="dummy" searchWhenChanged="true">
      <label>Show Help:</label>
      <default>No</default>
      <choice value="No">No</choice>
      <choice value="Yes">Yes</choice>
      <change>
        <condition value="No">
          <unset token="showhelp" />
        </condition>
        <condition value="Yes">
          <set token="showhelp">awwwyeah</set>
        </condition>
      </change>
    </input>
  </fieldset>

  <row>
    <panel depends="$showhelp$">
      <html>
        <h1>
          HTML Panels
        </h1>
        <p>Easily add content to clarify use of a dashboard.</p>
      </html>
    </panel>
  </row>
</form>

martin_mueller · ‎08-22-2016

There are several issues with your attempt:

Your token $showhelp$ would be set at any given time, so the depends will always show the panel
A panel doesn't have a label child element
Your row element is inside the panel, it should be the other way 'round

I've added a working example to the answer.

dkrichards16 · ‎02-18-2019

This great. Very simple to use. A lot eaiser than all the js versions out there!

dbcase · ‎08-22-2016

Hi Martin!

Many thanks!!! That did the trick!

martin_mueller · ‎08-21-2016

Grab the Splunk 6.x Dashboard Examples app: https://splunkbase.splunk.com/app/1603/

You'll find an example for basic HTML panels and examples showing and hiding panels (e.g. Null Search Swapper, Link Switcher).

dbcase · ‎08-22-2016

OK I've taken a few stabs at this and so far no luck.

Here is what I have. When the radio button gets changed to Yes, the panel doesn't appear.

 <input type="radio" token="showhelp" searchWhenChanged="true">
      <label>Show Help:</label>
      <default>No</default>
      <choice value="No">No</choice>
      <choice value="Yes">Yes</choice>
    </input>

  </fieldset>


  <panel depends="$showhelp$">
    <label>Dashboard Help</label>
    <row>
        <html>
            <h1>
                HTML Panels
            </h1>
            <p>Easily add content to clarify use of a dashboard.</p>
        </html>
    </row>
  </panel>

dbcase · ‎08-21-2016

Thats what I was thinking but unsure how to go about it. Could you provide an example?

Add a help panel to a dashboard?

Earn a $35 Gift Card for Answering our Splunk Admins & App Developer Survey

Continuing Innovation & New Integrations Unlock Full Stack Observability For Your ...

Monitoring Amazon Elastic Kubernetes Service (EKS)