Dashboards & Visualizations

by default select few values in multiselect dynamically and remaining values in multiselect list

ips_mandar
Builder

Hi,

To explain my scenario I created sample dashboard in xml (see below).

Here selection of Group input will Populate from lookup table as per selected sourcetype and now currently I am showing bytes value in pre-selected multiselect filter from lookup as per selection of sourcetype and Group. Now My requirement is -

  1. I want to combine two multiselect filter i.e. pre-selected bytes should have values as per Group and sourcetype selection and allow user to select more bytes(if required) by using Select bytes multiselect input query (index="_internal" sourcetype="$sourcetype$"|stats count by bytes sourcetype) . for ex.- I selected sourcetype-splunkd_access, Group-simple_test then pre select multiselect will get auto populate with values-5633,5643,167 and on clicking Select bytes multiselect filter it shows few bytes values and I want to shows all those values for selection in pre-selected bytes. so that there will be only one multiselect input.
  2. I want to add All Group option in select Group dropdown and on selection of All Group in pre-selected bytes all value should get populate.

Please let me know how I can achieve this. I tried to combine two multiselect queries but did not get any success.

Thanks.

<form script="group.js">
  <label>bytesgroup</label>
  <fieldset submitButton="false">
    <input type="dropdown" token="sourcetype" searchWhenChanged="true">
      <label>sourcetype</label>
      <fieldForLabel>sourcetype</fieldForLabel>
      <fieldForValue>sourcetype</fieldForValue>
      <search>
        <query>index=_internal|stats count by sourcetype</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
    </input>
    <input type="dropdown" token="Group" searchWhenChanged="true" id="grp">
      <label>select group</label>
      <fieldForLabel>Group</fieldForLabel>
      <fieldForValue>Group</fieldForValue>
      <search>
        <query>|inputlookup group.csv|search sourcetype="$sourcetype$"|stats count by Group</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
    </input>
    <input type="multiselect" token="field1" id="idSelectIndex">
      <label>pre-selected bytes</label>
      <prefix>(</prefix>
      <suffix>)</suffix>
      <valuePrefix>bytes="</valuePrefix>
      <valueSuffix>"</valueSuffix>
      <delimiter> OR </delimiter>
      <fieldForLabel>bytes</fieldForLabel>
      <fieldForValue>bytes</fieldForValue>
      <search id="idSearchSelectIndex">
        <query>|inputlookup group.csv|search sourcetype="$sourcetype$" AND Group="$Group$"|fields bytes</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
      <choice value="*">All</choice>
    </input>
    <input type="multiselect" token="selected_bytes">
      <label>Select bytes</label>
      <delimiter> </delimiter>
      <fieldForLabel>bytes</fieldForLabel>
      <fieldForValue>bytes</fieldForValue>
      <search>
        <query>index="_internal" sourcetype="$sourcetype$"|stats count by bytes sourcetype</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
    </input>
    <input type="time" token="time_slice">
      <label>time</label>
      <default>
        <earliest>-24h@h</earliest>
        <latest>now</latest>
      </default>
    </input>
  </fieldset>
  <row>
    <panel>
      <table>
        <search>
          <query>index=_internal sourcetype=splunkd_access $field1$|stats count by bytes</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="count">5</option>
        <option name="dataOverlayMode">none</option>
        <option name="drilldown">none</option>
        <option name="percentagesRow">false</option>
        <option name="refresh.display">progressbar</option>
        <option name="rowNumbers">false</option>
        <option name="totalsRow">false</option>
        <option name="wrap">true</option>
      </table>
    </panel>
  </row>
</form>

group.js code-

 var deps = [
     "splunkjs/ready!"
 ];
 require(deps, function(mvc) {
    console.log("js is read");
    var idSelectIndex = mvc.Components.get('idSelectIndex');
     var tokens = mvc.Components.get("default");
     var defaultTokenModel = mvc.Components.get("default");
    var idSearchSelectIndex = mvc.Components.get("idSearchSelectIndex");
     var idSearchSelectIndex_results = idSearchSelectIndex.data("preview");
     idSearchSelectIndex_results.on("data", function() {
         var allValues = [];
          $.each(idSearchSelectIndex_results.data().rows, function( Vehicle, value ) {
            // console.log(" Inside Loop to predined vehicle loop field1");
             allValues.push(value[0]);
         });
         idSelectIndex.settings.set("default",allValues);
         var grpp = defaultTokenModel.get("Group");
         console.log("Group: ",grpp);
});
});

and group.csv lookup-

sourcetype,Group,bytes
splunkd_access,testing,167
splunkd_access,testing,114
splunkd_access,testing,1700
splunkd_access,simple_test,5633
splunkd_access,simple_test,5643
splunkd_access,simple_test,167
Labels (1)
0 Karma

ololdach
Builder

Hi,

I've implemented your dashboard, changed some and for me it works out of the box, without js. Try this and let me know, if it helps:

<form>
  <label>bytesgroup</label>
  <fieldset submitButton="false">
    <input type="dropdown" token="sourcetype" searchWhenChanged="true">
      <label>sourcetype</label>
      <fieldForLabel>sourcetype</fieldForLabel>
      <fieldForValue>sourcetype</fieldForValue>
      <search>
        <query>index=_internal|stats count by sourcetype</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
    </input>
    <input type="multiselect" token="Group" searchWhenChanged="true" id="grp">
      <label>select group</label>
      <fieldForLabel>Group</fieldForLabel>
      <fieldForValue>Group</fieldForValue>
      <search>
        <query>|inputlookup group.csv where sourcetype="$sourcetype$" |stats count by Group</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
      <delimiter>|</delimiter>
      <choice value=".*">All Groups</choice>
    </input>
    <input type="multiselect" token="field1" id="idSelectIndex">
      <label>pre-selected bytes</label>
      <prefix>(</prefix>
      <suffix>)</suffix>
      <valuePrefix>bytes="</valuePrefix>
      <valueSuffix>"</valueSuffix>
      <delimiter> OR </delimiter>
      <fieldForLabel>bytes</fieldForLabel>
      <fieldForValue>bytes</fieldForValue>
      <search id="idSearchSelectIndex">
        <query>|inputlookup group.csv where sourcetype="$sourcetype$" | where match(Group,"$Group$") | fields bytes | dedup bytes</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
      <choice value="*">All</choice>
    </input>
    <input type="multiselect" token="selected_bytes">
      <label>Select bytes</label>
      <delimiter> </delimiter>
      <fieldForLabel>bytes</fieldForLabel>
      <fieldForValue>bytes</fieldForValue>
      <search>
        <query>index="_internal" sourcetype="$sourcetype$"|stats count by bytes sourcetype</query>
        <earliest>$time_slice.earliest$</earliest>
        <latest>$time_slice.latest$</latest>
      </search>
    </input>
    <input type="time" token="time_slice">
      <label>time</label>
      <default>
        <earliest>-24h@h</earliest>
        <latest>now</latest>
      </default>
    </input>
  </fieldset>
  <row>
    <panel>
      <table>
        <search>
          <query>index=_internal sourcetype=splunkd_access $field1$|stats count by bytes</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
        </search>
        <option name="count">5</option>
        <option name="dataOverlayMode">none</option>
        <option name="drilldown">none</option>
        <option name="percentagesRow">false</option>
        <option name="refresh.display">progressbar</option>
        <option name="rowNumbers">false</option>
        <option name="totalsRow">false</option>
        <option name="wrap">true</option>
      </table>
    </panel>
  </row>
</form>

Oliver

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!

SOC4Kafka - New Kafka Connector Powered by OpenTelemetry

The new SOC4Kafka connector, built on OpenTelemetry, enables the collection of Kafka messages and forwards ...

Rounding off the Splunk Dashboard Contest

What does a contest-winning Splunk dashboard look like? In this case, it isn't in a browser tab at all. It ...

A Four Part Event Series: AI + Observability: AI Agents, LLMs, Apps, & Infrastructure

AI &#43; Observability: AI Agents, LLMs, Apps, & Infrastructure The rapid evolution of artificial intelligence ...