topic Re: Require input value in text box in Dashboards & Visualizations

Require input value in text box

ben_leung — Thu, 19 Jun 2014 23:13:55 GMT

When a user clicks on the search button in the dashboard, it will run the search query, populating the panel with the chart. What can I do to make it so that there has to be a value in the text box for token $hostName1$ ?

<fieldset submitButton="true">
    <input type="text" token="hostName1">
      <label>Host 1</label>
      <default/>
      <prefix> host=</prefix>
    </input>
    <input type="text" token="hostName2">
      <label>Host 2</label>
      <default/>
      <prefix>OR host=</prefix>
    </input>
    <input type="text" token="hostName3">
      <default/>
      <label>Host 3</label>
      <prefix>OR host=</prefix>
    </input>
    <input type="text" token="hostName4">
      <default/>
      <label>Host 4</label>
      <prefix>OR host=</prefix>
    </input>
    <input type="text" token="hostName5">
      <default/>
      <label>Host 5</label>
      <prefix>OR host=</prefix>
    </input>

    <chart>
      <title>Percent CPU Utilized </title>
      <searchString>index=os_core $hostName1$ $hostName2$ $hostName3$ $hostName4$ $hostName5$ $hostName6$ | eval PctCPU = 100 - pctIdle  | timechart avg(PctCPU) by host</searchString>
      <option name="charting.axisY.scale">linear</option>
      <option name="charting.chart">line</option>
      <option name="charting.chart.nullValueMode">gaps</option>
      <option name="charting.chart.stackMode">default</option>
      <option name="charting.layout.splitSeries">0</option>
      <option name="charting.legend.placement">bottom</option>
      <option name="charting.secondaryAxis.scale">linear</option>
      <option name="count">50</option>
      <option name="displayRowNumbers">true</option>
      <option name="charting.axisTitleX.visibility">visible</option>
      <option name="charting.axisTitleY.visibility">visible</option>
      <option name="charting.axisX.scale">linear</option>
      <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
      <option name="charting.chart.style">shiny</option>
      <option name="charting.drilldown"></option>
      <option name="charting.legend.labelStyle.overflowMode">ellipsisMiddle</option>
      <option name="charting.secondaryAxis.minimumNumber">0</option>
      <option name="charting.secondaryAxis.maximumNumber">100</option>
      <option name="height">150px</option>
    </chart>

Re: Require input value in text box

ben_leung — Thu, 19 Jun 2014 23:53:39 GMT

Is this possible since without the host field, the time chart will still be able to run once the submit button is hit.

Re: Require input value in text box

linu1988 — Fri, 20 Jun 2014 03:51:15 GMT

put a java script in your input and validate it. If no input is given re-focus on that again. Could you give it a try?

Re: Require input value in text box

ben_leung — Fri, 20 Jun 2014 15:52:53 GMT

If there is no way to do this in advance xml, then I will tell our users that they will have to make this a development item.

Re: Require input value in text box

dfoster_splunk — Fri, 20 Jun 2014 17:25:18 GMT

You could just set the default value to * if matching multiple hosts is okay.

Re: Require input value in text box

linu1988 — Sat, 21 Jun 2014 02:35:04 GMT

you can do it. Using the pulldown module user have to choose one value or a default value will be chosen.

Re: Require input value in text box

ben_leung — Sun, 22 Jun 2014 03:40:53 GMT

@linu1988 I am looking into the side view util app for more info on the pulldown module. It is too bad that the number of host values is over 100, which is why we need a text input box.

Re: Require input value in text box

ben_leung — Sun, 22 Jun 2014 03:48:52 GMT

I wonder if you can default the value to something that would not even start the search. I don't think that's possible though.

Re: Require input value in text box

dfoster_splunk — Mon, 23 Jun 2014 16:41:04 GMT

You could split the input field token and dashboard token to be two tokens. Then use SplunkJS to populate the second token only when the first one has a non-empty value. In the meantime the dashboard will refuse to render anything with the second token until it is populated.

Something like:

require(['splunkjs/ready!'], function(mvc) {
    mvc.Components.get('default').on('change:inputToken', function(model, newValue) {
        if (newValue) {
            mvc.Components.get('submitted').set('dashboardToken', newValue);
        }
    });
});

More info here: http://dev.splunk.com/view/webframework-concepts/SP-CAAAEW4