topic Re: how to clear dropdown box? in Dashboards & Visualizations

how to clear dropdown box?

eliasabouhamad — Tue, 19 May 2015 13:31:08 GMT

hi,

how to clear dropdown box? . i have 2 dropdown box related i need to reset or clear the second one on the change off the first one.

regrads,
Elias

Re: how to clear dropdown box?

torrentg — Wed, 05 Aug 2015 10:26:59 GMT

I solved a similar problem using this javascript:

require([
    'splunkjs/ready!',
    'splunkjs/mvc/textinputview',
    'splunkjs/mvc/dropdownview'
  ],
  function(mvc) {
    var input1 = mvc.Components.get('input1');
    var input2 = mvc.Components.get('input2');
    input1.on('change', function() {
      input2.val(undefined);
    });
});

Re: how to clear dropdown box?

cssmdi — Wed, 16 May 2018 14:36:56 GMT

Hi
No chance to do this with simple XML and without HTML and JavaScript?
Regards
Matthias

Re: how to clear dropdown box?

niketn — Thu, 17 May 2018 08:54:09 GMT

@cssmdi, @eliasabouhamad

On change of value of the main dropdown, set both the depended dropdown token and its corresponding form token as well. Following is a run anywhere example:
The <change> event handler for Dropdown 1 updates both the token and form token for Dropdown2

      <change>
        <set token="form.tokDropdown2">$value$</set>
        <set token="tokDropdown2">$value$</set>
      </change>

Please try out and confirm!

<form>
  <label>Clear Dropdown 2 Selection On Change of Dropdown 1</label>
  <fieldset submitButton="false">
    <input type="dropdown" token="tokDropdown1" searchWhenChanged="true">
      <label>Dropdown 1</label>
      <choice value="a">Alpha</choice>
      <choice value="b">Beta</choice>
      <choice value="c">Charlie</choice>
      <change>
        <set token="form.tokDropdown2">$value$</set>
        <set token="tokDropdown2">$value$</set>
      </change>
      <default>a</default>
    </input>
    <input type="dropdown" token="tokDropdown2" searchWhenChanged="true">
      <label>Dropdown 2</label>
      <choice value="a">Apple</choice>
      <choice value="b">Banana</choice>
      <choice value="c">Cucumber</choice>
      <default>a</default>
    </input>
  </fieldset>
  <row>
    <panel>
      <html>
        <div>Dropdown 1: $tokDropdown1$</div>
        <div>Dropdown 2: $tokDropdown2$</div>
      </html>
    </panel>
  </row>
</form>

Re: how to clear dropdown box?

cssmdi — Tue, 29 Sep 2020 19:34:15 GMT

Hi niketnilay

Works like a charm. Thank you very much!!
I missed the <set token="form.tokDropdown2">value_to_set</set>
It is hard to find this form.tokenname in the documentation.

Kind regards
Matthias

Re: how to clear dropdown box?

niketn — Thu, 17 May 2018 11:14:26 GMT

@cssmdi I know that you have not posted the Question so you can not accept the answer. But do up vote the answer/comments that helped 🙂

Do try and get the Splunk Dashboard Examples App which has several everyday use case examples including those for Drilldown, Cascaded Dropdown and Tokens etc.