Dashboards & Visualizations

How to get the values of a drop-down box input to navigate to another page in Simple XML?

Dawson014
Path Finder

Hello,

My Dashboard has two simple drop-downs which generate the options in them dynamically by executing a search. The search performs an inputlookup to populate the drop-downs from a csv file present in the server.
Here's how my csv file looks like:

APP_FAMILY,APPLICATION
app_fam1,app_name1
app_fam1,app_name2
app_fam2,app_name3
app_fam2,app_name4

Now the first drop-down populates itself with the distinct values from the APP_FAMILY (application family) column, and then the second drop-down populates itself with the applications under that application family.

Now, according to what application the user chooses, the page should load that application specific page containing its metrics in a dashboard.

Example:
If the application name is app_name1;
the page that loads should be business_metrics_app_name1?form.app_family=app_fam1&form.app=app_name1

Here's my code in Simple XML:

<form>
  <label>Business Metrics</label>
  <fieldset submitButton="false" autoRun="true">
    <input type="dropdown" token="app_family" searchWhenChanged="true">
      <label>Select Application Family</label>
      <search>
        <query>| inputlookup lookupFile.csv | table App_Family | dedup App_Family</query>
        <earliest>0</earliest>
      </search>
      <fieldForLabel>App_Family</fieldForLabel>
      <fieldForValue>App_Family</fieldForValue>
    </input>
    <input type="dropdown" token="app" searchWhenChanged="true">
      <label>Select Application</label>
      <search>
        <query>| inputlookup lookupFile.csv | where App_Family="$app_family$" | table Application</query>
        <earliest>0</earliest>
      </search>
      <fieldForLabel>Application</fieldForLabel>
      <fieldForValue>Application</fieldForValue>
    </input>
  </fieldset>
</form>

how can this be achieved using simple XML?

I can perform the task using HTML and JQuery, but I want the same look and feel that splunk provides in the dashboard.
If further clarifications are needed I will assist in any way I can.

alt text

1 Solution

somesoni2
Revered Legend

You can give this a try. This give two dropdown (used your sample static data, change the dropdown queries accordingly). Once you select options from both the dropdown, a table appears with clickable rows. Click on the row will redirect to specified URL with values passed from dropdown.

<form>
  <label>Business Metrics</label>
  <fieldset submitButton="false" autoRun="true">
    <input type="dropdown" token="app_family" searchWhenChanged="true">
      <label>Select Application Family</label>
      <search>
        <query>| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | table App_Family | dedup App_Family</query>
        <earliest>0</earliest>
      </search>
      <fieldForLabel>App_Family</fieldForLabel>
      <fieldForValue>App_Family</fieldForValue>
      <populatingSearch fieldForLabel="App_Family" fieldForValue="App_Family">| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | table App_Family | dedup App_Family</populatingSearch>
    </input>
    <input type="dropdown" token="app" searchWhenChanged="true">
      <label>Select Application</label>
      <search>
        <query>| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | where App_Family="$app_family$" | table Application</query>
        <earliest>0</earliest>
      </search>
      <fieldForLabel>Application</fieldForLabel>
      <fieldForValue>Application</fieldForValue>
      <populatingSearch fieldForLabel="Application" fieldForValue="Application">| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | where App_Family="$app_family$" | table Application</populatingSearch>
    </input>
  </fieldset>
   <row>
    <panel>
      <table depends="$app$">
        <title>Launcher</title>
        <searchString>| gentimes start=-1 | eval Launcher="Click Here to Launch the Dashboard" | table Launcher</searchString>
        <earliestTime>0</earliestTime>
        <latestTime/>       
        <option name="wrap">true</option>
        <option name="rowNumbers">false</option>
        <option name="dataOverlayMode">none</option>
        <option name="drilldown">cell</option>
        <drilldown>
          <link>
             <![CDATA[
/app/YourAppNameHere/business_metrics_$app$?form.app_family=$app_family$&form.app=$app$
  ]]>
          </link>
        </drilldown>
        <option name="count">10</option>
      </table>
    </panel>
  </row>
</form>

View solution in original post

somesoni2
Revered Legend

You can give this a try. This give two dropdown (used your sample static data, change the dropdown queries accordingly). Once you select options from both the dropdown, a table appears with clickable rows. Click on the row will redirect to specified URL with values passed from dropdown.

<form>
  <label>Business Metrics</label>
  <fieldset submitButton="false" autoRun="true">
    <input type="dropdown" token="app_family" searchWhenChanged="true">
      <label>Select Application Family</label>
      <search>
        <query>| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | table App_Family | dedup App_Family</query>
        <earliest>0</earliest>
      </search>
      <fieldForLabel>App_Family</fieldForLabel>
      <fieldForValue>App_Family</fieldForValue>
      <populatingSearch fieldForLabel="App_Family" fieldForValue="App_Family">| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | table App_Family | dedup App_Family</populatingSearch>
    </input>
    <input type="dropdown" token="app" searchWhenChanged="true">
      <label>Select Application</label>
      <search>
        <query>| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | where App_Family="$app_family$" | table Application</query>
        <earliest>0</earliest>
      </search>
      <fieldForLabel>Application</fieldForLabel>
      <fieldForValue>Application</fieldForValue>
      <populatingSearch fieldForLabel="Application" fieldForValue="Application">| gentimes start=-1 | eval temp="app_fam1,app_name1  app_fam1,app_name2  app_fam2,app_name3  app_fam2,app_name4" | table temp | makemv temp | mvexpand temp | rex field=temp "(?<App_Family>.*),(?<Application>.*)" | where App_Family="$app_family$" | table Application</populatingSearch>
    </input>
  </fieldset>
   <row>
    <panel>
      <table depends="$app$">
        <title>Launcher</title>
        <searchString>| gentimes start=-1 | eval Launcher="Click Here to Launch the Dashboard" | table Launcher</searchString>
        <earliestTime>0</earliestTime>
        <latestTime/>       
        <option name="wrap">true</option>
        <option name="rowNumbers">false</option>
        <option name="dataOverlayMode">none</option>
        <option name="drilldown">cell</option>
        <drilldown>
          <link>
             <![CDATA[
/app/YourAppNameHere/business_metrics_$app$?form.app_family=$app_family$&form.app=$app$
  ]]>
          </link>
        </drilldown>
        <option name="count">10</option>
      </table>
    </panel>
  </row>
</form>

Dawson014
Path Finder

I thought that the submit button can be manipulated to this extent, but this will work too. Thank you for your answer @somesoni2

Get Updates on the Splunk Community!

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

You’ve probably heard the latest about AppDynamics joining the Splunk Observability portfolio, deepening our ...

Monitoring Amazon Elastic Kubernetes Service (EKS)

As we’ve seen, integrating Kubernetes environments with Splunk Observability Cloud is a quick and easy way to ...

Cloud Platform & Enterprise: Classic Dashboard Export Feature Deprecation

As of Splunk Cloud Platform 9.3.2408 and Splunk Enterprise 9.4, classic dashboard export features are now ...