Dashboards & Visualizations

How to add validation on form dashboard input textfield?

axl88
Communicator

thanks all in advance for your time.
I am trying to create a field validation on my dashboard. My fieldset on dashboard is following:

<fieldset autoRun="true" submitButton="true" >  
<input type="text" token="startdate" searchWhenChanged="true" name="sdate" id="sdate">
  <placeholder>Last Month</placeholder>
  <default></default>
  <label>Select a Start Date:</label>
</input>
</fieldset>

And I am trying to retrieve values from my dashboard with the following JS code in app/static directory:

var unsubmittedTokens = mvc.Components.get('default');
var submittedTokens = mvc.Components.get('submitted');
var urlTokens = mvc.Components.get('url');
var startDate = mvc.Components.get('sdate');
submittedTokens.on('change:startdate', function(){
    // When the token changes...
    if(!submittedTokens.get('startdate')) {
        alert("no token");
    } else {
        alert("got a token");
        var startdate = document.getElementsByName('sdate').value;
        alert(startdate);
    }
});

I couldn't start my validation functions since somehow I can't get value of the field to JS.
I want my validation to work in input textfields whenever a field value changes.
I can get value "undefined" with getelementbyName function above. But I can't get what user entered into textfield.

I would be appreciated if someone can help me with above, moreover, if there is an easier way to validate fields on form-Dashboard, you could share it as well.

I m a new splunker, thanks again for your time&efforts.

LukeMurphey
Champion

Try getting the value using "mvc.Components.get("sdate").val()". Thus, your code should look something like this:

var unsubmittedTokens = mvc.Components.get('default');
var submittedTokens = mvc.Components.get('submitted');
var urlTokens = mvc.Components.get('url');
var startDate = mvc.Components.get('sdate');
submittedTokens.on('change:startdate', function(){
    // When the token changes...
    if(!submittedTokens.get('startdate')) {
        alert("no token");
    } else {
        alert("got a token");
        var startdate = mvc.Components.get("sdate").val();
        alert(startdate);
    }
});

axl88
Communicator

hey Luke,
I tried this before. I don't know why but got a token alert works. But Val() function doesn't work. that alert is not launched at all. Apparently JS fails to compile at that line. I keep searching, thanks for response.

0 Karma

nadine_wondem
New Member

Did you find a solution to this issue? I am having the same problem getting val() to work.

0 Karma
Get Updates on the Splunk Community!

Splunk Answers Content Calendar, June Edition

Get ready for this week’s post dedicated to Splunk Dashboards! We're celebrating the power of community by ...

What You Read The Most: Splunk Lantern’s Most Popular Articles!

Splunk Lantern is a Splunk customer success center that provides advice from Splunk experts on valuable data ...

See your relevant APM services, dashboards, and alerts in one place with the updated ...

As a Splunk Observability user, you have a lot of data you have to manage, prioritize, and troubleshoot on a ...