Dashboards & Visualizations

Dashboard

silverKi
Path Finder

silverKi_0-1717562227032.png

I want to fill the table cells with tags. Like multi selector.. How can I make the table contents look like tags?
How to do it without using html elements?? 

Labels (3)
0 Karma

silverKi
Path Finder

Does anybidy konw when I clicked valueo in table cell How I render input btn?

0 Karma

ITWhisperer
SplunkTrust
SplunkTrust

Do you mean something like this:

  <row>
    <panel depends="$stayhidden$">
      <html>
        <style>
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2)
          {
            display: flex !important;
          }
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2) .multivalue-subcell
          {
            padding-left: 4px;
            padding-right: 4px;
            margin-left: 4px;
            margin-right: 4px;
            border: 2px solid white !important;
            border-radius: 8px !important;
            color: white !important;
            box-shadow:
              inset 0 0 3px 0 rgba(0,0,0,.4),
              inset 0 0 3px 5px rgba(0,0,0,.05),
              inset 2px 3px 4px 0 rgba(255,255,255,.6),
              2px 2px 4px 0 rgba(0,0,0,.25) !important;
          }
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2) .multivalue-subcell:hover
          {
            box-shadow:
              inset 0 0 3px 0 rgba(0,0,0,.4),
              inset 0 0 3px 5px rgba(0,0,0,.05),
              inset 2px 3px 4px 0 rgba(255,255,255,.6),
              0 12px 16px 0 rgba(0,0,0,0.24),
              0 17px 50px 0 rgba(0,0,0,0.19) !important;
            transform: translateY(-1px) !important;
          }
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2) .multivalue-subcell:active
          {
            box-shadow:
              inset 0 0 3px 0 rgba(0,0,0,.4),
              inset 0 0 3px 5px rgba(0,0,0,.05),
              inset 2px 3px 4px 0 rgba(255,255,255,.6),
              0 8px 16px 0 rgba(0,0,0,0.24),
              0 13px 50px 0 rgba(0,0,0,0.19) !important;
            transform: translateY(2px) !important;
          }
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2) .multivalue-subcell
          {
            background-color: yellow !important;
            color: black !important;
          }
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2) .multivalue-subcell[data-mv-index="0"]
          {
            display: none !important;
          }
        </style>
      </html>
    </panel>
    <panel>
      <table id="states">
        <title>States $state$</title>
        <search>
          <query>| makeresults count=10
| eval event=random() % 3 
| eval state=mvindex(split("ACTIVE,SLEEP,DEAD",","),random() % 3) 
| stats values(state) as state by event
| eval state=mvappend("extra",state)</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">row</option>
        <drilldown>
          <eval token="state">$click.value2$</eval>
        </drilldown>
      </table>
    </panel>
  </row>
0 Karma

ITWhisperer
SplunkTrust
SplunkTrust

Your subject is very broad - how would anyone know what this was specifically about especially given that it is already in a Dashboards & Visualizations section!

Having said that, you then restrict your required solution to not include HTML - as @gcusello says, with these restrictions, it isn't possible (with current standard visualization options).

However, if you would be prepared to expand your outlook you could do something along these lines:

 

  <row>
    <panel depends="$stayhidden$">
      <html>
        <style>
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2)
          {
            display: flex !important;
          }
          div[id="states"] tr[data-view$="ResultsTableRow"] td:nth-child(2) .multivalue-subcell
          {
            border: 2px solid black !important;
            padding-left: 4px;
            padding-right: 4px;
            margin-left: 4px;
            margin-right: 4px;
            border-radius: 8px !important;
          }
        </style>
      </html>
    </panel>
    <panel>
      <table id="states">
        <title>States</title>
        <search>
          <query>| makeresults count=10
| eval event=random() % 3 
| eval state=mvindex(split("ACTIVE,SLEEP,DEAD",","),random() % 3) 
| stats values(state) as state by event</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">none</option>
        <option name="refresh.display">progressbar</option>
      </table>
    </panel>
  </row>

 

ITWhisperer_0-1717574403854.png

Note that this doesn't work if there is only one value in the multivalue field (however, with a bit of extra work, this can be gotten around by inserting an additional value to the field and then hiding this value.

0 Karma

gcusello
SplunkTrust
SplunkTrust

Hi @silverKi ,

in my knowledge, it isn't possible!

Ciao.

Giuseppe

0 Karma
Got questions? Get answers!

Join the Splunk Community Slack to learn, troubleshoot, and make connections with fellow Splunk practitioners in real time!

Meet up IRL or virtually!

Join Splunk User Groups to connect and learn in-person by region or remotely by topic or industry.

Get Updates on the Splunk Community!

Splunk Community Badges!

  Hey everyone! Ready to earn some serious bragging rights in the community? Along with our existing badges ...

How to find the worst searches in your Splunk environment and how to fix them

Everyone knows Splunk is a powerful platform for running searches and doing data analytics. Your ...

Share Your Feedback: On Admin Config Service (ACS)!

Help Us Build a Better Admin Config Service Experience (ACS)   We Want Your Feedback on Admin Config Service ...