Dashboards & Visualizations

Dropdown on a panel

dbcase
Motivator

Hi,

I have the below simple XML code for a dropdown on a panel but for some reason I can't get it to show on the panel. What am I missing? (tablevariablescubscribers is set from a table selection and the resulting chart works just fine. Just no dropdown visible)

<!-- Begin create a line chart based off of the drilldown above -->
      <!-- Don't show a panel until tablevariable is set -->
      <chart depends="$tablevariablesubscribers$">
        <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

       <input type="dropdown" token="predict_time" searchWhenChanged="true">
      <label>Select number of days to predict:</label>
      <default>ccivirpxa0*</default>
      <choice value="90">90 Days</choice>
      <choice value="7">7 Days</choice>
      <choice value="30">30 Days</choice>
      <choice value="60">60 Days</choice>
      <choice value="180">180 Days</choice>
      <choice value="365">365 Days</choice>
      <choice value="1000">Maximum</choice>
    </input>









        <search>
          <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
          <earliest>0</earliest>
        </search>
        <option name="charting.chart">column</option>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">collapsed</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">zero</option>
        <option name="charting.chart.showDataLabels">none</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.layout.splitSeries.allowIndependentYRanges">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
        <option name="charting.axisTitleY.text">Subscriber Count</option>
      </chart>
      <!-- End create a line chart based off of the drilldown above -->
    </panel>
  </row>
0 Karma
1 Solution

sundareshr
Legend

Try moving the input outside the chart and add depends to the panel instead. Like this

<panel depends="$tablevariablesubscribers$">
         <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

        <input type="dropdown" token="predict_time" searchWhenChanged="true">
       <label>Select number of days to predict:</label>
       <default>ccivirpxa0*</default>
       <choice value="90">90 Days</choice>
       <choice value="7">7 Days</choice>
       <choice value="30">30 Days</choice>
       <choice value="60">60 Days</choice>
       <choice value="180">180 Days</choice>
       <choice value="365">365 Days</choice>
       <choice value="1000">Maximum</choice>
     </input>








<chart>

         <search>
           <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
           <earliest>0</earliest>
         </search>
         <option name="charting.chart">column</option>
         <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
         <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
         <option name="charting.axisTitleX.visibility">collapsed</option>
         <option name="charting.axisTitleY.visibility">visible</option>
         <option name="charting.axisTitleY2.visibility">visible</option>
         <option name="charting.axisX.scale">linear</option>
         <option name="charting.axisY.scale">linear</option>
         <option name="charting.axisY2.enabled">0</option>
         <option name="charting.axisY2.scale">inherit</option>
         <option name="charting.chart.bubbleMaximumSize">50</option>
         <option name="charting.chart.bubbleMinimumSize">10</option>
         <option name="charting.chart.bubbleSizeBy">area</option>
         <option name="charting.chart.nullValueMode">zero</option>
         <option name="charting.chart.showDataLabels">none</option>
         <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
         <option name="charting.chart.stackMode">default</option>
         <option name="charting.chart.style">shiny</option>
         <option name="charting.drilldown">all</option>
         <option name="charting.layout.splitSeries">0</option>
         <option name="charting.layout.splitSeries.allowIndependentYRanges">0</option>
         <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
         <option name="charting.legend.placement">right</option>
         <option name="charting.axisTitleY.text">Subscriber Count</option>
       </chart>
       <!-- End create a line chart based off of the drilldown above -->
     </panel>
   </row>

View solution in original post

0 Karma

sundareshr
Legend

Try moving the input outside the chart and add depends to the panel instead. Like this

<panel depends="$tablevariablesubscribers$">
         <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

        <input type="dropdown" token="predict_time" searchWhenChanged="true">
       <label>Select number of days to predict:</label>
       <default>ccivirpxa0*</default>
       <choice value="90">90 Days</choice>
       <choice value="7">7 Days</choice>
       <choice value="30">30 Days</choice>
       <choice value="60">60 Days</choice>
       <choice value="180">180 Days</choice>
       <choice value="365">365 Days</choice>
       <choice value="1000">Maximum</choice>
     </input>








<chart>

         <search>
           <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
           <earliest>0</earliest>
         </search>
         <option name="charting.chart">column</option>
         <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
         <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
         <option name="charting.axisTitleX.visibility">collapsed</option>
         <option name="charting.axisTitleY.visibility">visible</option>
         <option name="charting.axisTitleY2.visibility">visible</option>
         <option name="charting.axisX.scale">linear</option>
         <option name="charting.axisY.scale">linear</option>
         <option name="charting.axisY2.enabled">0</option>
         <option name="charting.axisY2.scale">inherit</option>
         <option name="charting.chart.bubbleMaximumSize">50</option>
         <option name="charting.chart.bubbleMinimumSize">10</option>
         <option name="charting.chart.bubbleSizeBy">area</option>
         <option name="charting.chart.nullValueMode">zero</option>
         <option name="charting.chart.showDataLabels">none</option>
         <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
         <option name="charting.chart.stackMode">default</option>
         <option name="charting.chart.style">shiny</option>
         <option name="charting.drilldown">all</option>
         <option name="charting.layout.splitSeries">0</option>
         <option name="charting.layout.splitSeries.allowIndependentYRanges">0</option>
         <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
         <option name="charting.legend.placement">right</option>
         <option name="charting.axisTitleY.text">Subscriber Count</option>
       </chart>
       <!-- End create a line chart based off of the drilldown above -->
     </panel>
   </row>
0 Karma

dbcase
Motivator

Hi Sundareshr! Sorry I don't quite understand. The panel with the subscriber and prediction count shows up just fine. It's the dropdown that never shows up.

0 Karma

dbcase
Motivator

well I think I figured out what you are trying to tell me. Here is the updated code. But.... I get this error when trying to save

XML Syntax Error: Cannot find object mapper for panel type: panel

<panel depends="$tablevariablesubscribers$">
          <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

         <input type="dropdown" token="predict_time" searchWhenChanged="true">
        <label>Select number of days to predict:</label>
        <default>90</default>
        <choice value="90">90 Days</choice>
        <choice value="7">7 Days</choice>
        <choice value="30">30 Days</choice>
        <choice value="60">60 Days</choice>
        <choice value="180">180 Days</choice>
        <choice value="365">365 Days</choice>
        <choice value="1000">Maximum</choice>
      </input>




      <chart>


        <search>
          <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
          <earliest>0</earliest>
        </search>
        <option name="charting.chart">column</option>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">collapsed</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">zero</option>
        <option name="charting.chart.showDataLabels">none</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.layout.splitSeries.allowIndependentYRanges">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
        <option name="charting.axisTitleY.text">Subscriber Count</option>
      </chart>
      <!-- End create a line chart based off of the drilldown above -->
    </panel>
    </panel>
  </row>
</dashboard>
0 Karma

sundareshr
Legend

You have two </panel> towards the end, remove one

0 Karma

dbcase
Motivator

Hmmm, (sorry for all the hand holding here)

When I do that the editor complains with Encountered the following error while trying to update: In handler 'views': Error parsing XML on line 462: Premature end of data in tag dashboard line 1

<panel depends="$tablevariablesubscribers$">


         <input type="dropdown" token="predict_time" searchWhenChanged="true">
        <label>Select number of days to predict:</label>
        <default>90</default>
        <choice value="90">90 Days</choice>
        <choice value="7">7 Days</choice>
        <choice value="30">30 Days</choice>
        <choice value="60">60 Days</choice>
        <choice value="180">180 Days</choice>
        <choice value="365">365 Days</choice>
        <choice value="1000">Maximum</choice>
      </input>





      <chart>
        <title>Expanded Subscriber Connectivity for - $tablevariablesubscribers$</title>

        <search>
          <query>index=mso_statistics sourcetype=ic_connectivity_5min-too_small stat_name=subscribers| where lower(mso)=lower("$tablevariablesubscribers$") | timechart avg(stat_val) as Trend|predict Trend as Prediction  future_timespan=90|eval Prediction=round(Prediction,0)</query>
          <earliest>0</earliest>
        </search>
        <option name="charting.chart">column</option>
        <option name="charting.axisLabelsX.majorLabelStyle.overflowMode">ellipsisNone</option>
        <option name="charting.axisLabelsX.majorLabelStyle.rotation">0</option>
        <option name="charting.axisTitleX.visibility">collapsed</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.axisX.scale">linear</option>
        <option name="charting.axisY.scale">linear</option>
        <option name="charting.axisY2.enabled">0</option>
        <option name="charting.axisY2.scale">inherit</option>
        <option name="charting.chart.bubbleMaximumSize">50</option>
        <option name="charting.chart.bubbleMinimumSize">10</option>
        <option name="charting.chart.bubbleSizeBy">area</option>
        <option name="charting.chart.nullValueMode">zero</option>
        <option name="charting.chart.showDataLabels">none</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.chart.stackMode">default</option>
        <option name="charting.chart.style">shiny</option>
        <option name="charting.drilldown">all</option>
        <option name="charting.layout.splitSeries">0</option>
        <option name="charting.layout.splitSeries.allowIndependentYRanges">0</option>
        <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
        <option name="charting.legend.placement">right</option>
        <option name="charting.axisTitleY.text">Subscriber Count</option>
      </chart>
      <!-- End create a line chart based off of the drilldown above -->
    </panel>

  </row>
</dashboard>
0 Karma

dbcase
Motivator

Ok found where the other panel was and fixed it 🙂 Now it shows WITH the dropdown !!!! Thank you!!!!

0 Karma

sundareshr
Legend

The reason dropdown doesn't show is becuase you have it inside the chart tags. So it treats it as options/settings for the chart. Just the <input type=dropdown>.....</input> which is currently right after <chart depends="$tablevariablesubscribers$"> to before the <chart depends="$tablevariablesubscribers$"> and the set the token dependency at the panel level. SO your panel will look like this <panel depends="$tablevariablesubscribers$">

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!

Mastering Threat Intelligence in ES 8.5, Splunk AI Assistant v2, and More from Splunk ...

Splunk Lantern is Splunk’s customer success center that provides practical guidance from Splunk experts on key ...

Break the Build: Inside the KubeDoom Lounge at .conf26

    You step up to the machine. The pixelated corridors of a certain 1993 FPS load in front of you, EMP Pulse ...

Splunk Auto Ingestion Parallel Pipeline Scaling

Why this feature matters Many Splunk environments experience ingestion pressure long before the host is fully ...