topic How to clear the old selected value on a dropdown when I remove a value from a multiselect input? in Dashboards & Visualizations

How to clear the old selected value on a dropdown when I remove a value from a multiselect input?

azulgrana — Sun, 07 Jun 2020 23:58:08 GMT

Hi there!

I have a multiselect input named "Fields" that presents all the available fields and populates the table with the selected fields. Then based on the multiselect's values a dropdown named "Filter by" gets automatically populated and presents the user the ability to filter by a specific field.

Everything works fine and I'm able to filter my search.

My issue is when I delete the selected "Filter by" value from the multiselect input "Fields".

If you see the screenshot above, my dropdown still displays the old selected value while the multiselect actually doesn't have it and that of course breaks my search.

Any ideas on how to approach this? Below is a XML sample that would help to better see my issue.

<form>
  <label>Sample</label>
  <init>
    <set token="tokSearchby"></set>
  </init>
  <fieldset submitButton="false">
    <input type="multiselect" token="prmFields" searchWhenChanged="true">
      <label>Fields</label>
      <fieldForLabel>field</fieldForLabel>
      <fieldForValue>field</fieldForValue>
      <search>
        <query>index=_internal | top limit=20 sourcetype | eval percent = round(percent,2) | fieldsummary | table field</query>
        <earliest>0</earliest>
        <latest></latest>
      </search>
      <delimiter>,</delimiter>
      <change>
        <condition match="like($prmFields$,&quot;%pwdLastSet%&quot;)">
          <eval token="prmFields">prmFields.",pwdLastChangeDays"</eval>
        </condition>
      </change>
      <initialValue>count,percent,sourcetype</initialValue>
    </input>
    <input type="dropdown" token="prmFilterBy" searchWhenChanged="true">
      <label>Filter By</label>
      <fieldForLabel>field_desc</fieldForLabel>
      <fieldForValue>field_desc</fieldForValue>
      <search>
        <query>| makeresults | eval prmData=$prmFields|s$ | makemv delim="," prmData | mvexpand prmData |eval prmData=replace (prmData, "Attributes.", "")|eval prmData=replace (prmData, ".value", "") | rename prmData as field_desc | table field_desc</query>
        <earliest>-24h@h</earliest>
        <latest>now</latest>
      </search>
    </input>
    <input type="text" token="prmTextFilter" id="prmTextFilter" searchWhenChanged="true">
      <label>Text Filter</label>
      <default></default>
      <change>
        <condition>
          <set token="tokSearchby">| where $prmFilterBy$ like "%$prmTextFilter$%"</set>
        </condition>
      </change>
    </input>
  </fieldset>
  <row>
    <panel>
      <table>
        <title>Top Sources</title>
        <search>
          <query>index=_internal | top limit=20 sourcetype | eval percent = round(percent,2) | table $prmFields$ $tokSearchby$</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">none</option>
      </table>
    </panel>
  </row>
</form>

TIA!

Re: How to clear the old selected value on a dropdown when I remove a value from a multiselect input?

azulgrana — Fri, 22 May 2020 00:21:47 GMT

Fixed! a new condition on the multiselect named prmFields to identify whether my prmFilterBy exists or not in prmFields did the trick for me

    <condition match="!match($prmFields$,$prmFilterBy$)">
      <unset token="form.prmFilterBy"></unset>
      <unset token="form.prmTextFilter"></unset>
      <set token="tokSearchby"></set>
    </condition>
  </change>

Here's a copy of the XML code

<form>
  <label>Sample</label>
  <init>
    <set token="tokSearchby"></set>
  </init>
  <fieldset submitButton="false">
    <input type="multiselect" token="prmFields" searchWhenChanged="true">
      <label>Fields</label>
      <fieldForLabel>field</fieldForLabel>
      <fieldForValue>field</fieldForValue>
      <search>
        <query>index=_internal | top limit=20 sourcetype | eval percent = round(percent,2) | fieldsummary | table field | eval prmTest="Hola!"</query>
        <earliest>0</earliest>
        <latest></latest>
      </search>
      <delimiter>,</delimiter>
      <change>
        <condition match="match($prmFields$,$prmFilterBy$)"></condition>
        <condition match="!match($prmFields$,$prmFilterBy$)">
          <unset token="form.prmFilterBy"></unset>
          <unset token="form.prmTextFilter"></unset>
          <set token="tokSearchby"></set>
        </condition>
      </change>
      <initialValue>count,percent,sourcetype</initialValue>
    </input>
    <input type="dropdown" token="prmFilterBy" searchWhenChanged="true">
      <label>Filter By</label>
      <fieldForLabel>field_desc</fieldForLabel>
      <fieldForValue>field_desc</fieldForValue>
      <search>
        <query>| makeresults | eval prmData=$prmFields|s$ | makemv delim="," prmData | mvexpand prmData |eval prmData=replace (prmData, "Attributes.", "")|eval prmData=replace (prmData, ".value", "") | rename prmData as field_desc | table field_desc</query>
        <earliest>-24h@h</earliest>
        <latest>now</latest>
      </search>
    </input>
    <input type="text" token="prmTextFilter" id="prmTextFilter" searchWhenChanged="true">
      <label>Text Filter</label>
      <default></default>
      <change>
        <condition match=" len($prmTextFilter$) > 0 ">
          <set token="tokSearchby">| where $prmFilterBy$ like "%$prmTextFilter$%"</set>
        </condition>
        <condition match=" len($prmTextFilter$) == 0 ">
          <set token="tokSearchby"></set>
        </condition>
      </change>
    </input>
  </fieldset>
  <row>
    <panel>
      <table>
        <title>Top Sources</title>
        <search>
          <query>index=_internal | top limit=20 sourcetype | eval percent = round(percent,2) | table $prmFields$ $tokSearchby$</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
        </search>
        <option name="drilldown">none</option>
      </table>
    </panel>
  </row>
</form>

Re: How to clear the old selected value on a dropdown when I remove a value from a multiselect input?

lorenzoalbanof — Fri, 22 Oct 2021 10:26:07 GMT

Thank you for that...

I had a similar problem, a second dropdown that didn't unset its token when a change was done in the first dropdown. I adapted your solution for my ends.

Say we got a secondary input that does not unset its token when a change was done in the primary input.

There is token_1 and token_2. They are the token in the first (principal) input and the second (secondary) input, respectively. They are both populated by searches. And the values for token_2 depend on the values on token_1.

Because the token_2 search is subsidiary to the results of token_1, it literally has $token_1$ as a parameter and cannot work without it.

It should also be cleared and a new search launched as soon as token_1 is changed so as to NOT TO give "No Results Found" or worse yet (in the case of a coincidence of token_2 values) mislead the user.

Create a token_1_B that is set to be equal to token_1. *After* you check if the new value of token_1 coincides with the former value, token_1_B.

Unset token_2, the secondary if token_1 and token_1_B do not match, which means change.

Summarizing: Add this as conditional change to the input on the token_1

<change> <condition match="match($token_1$,$token_1_B$)"> <set token="token_1_B">$token_1$</set>  </condition> <condition match="!match($token_1$,$token_1_B$)"> <unset token="token_2"></unset> <unset token="form.token_2"></unset> <set token="token_1_B">$token_1$</set>  </condition> </change>