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!

Welcome to the Splunk Community!

(view in My Videos) We're so glad you're here! The Splunk Community is place to connect, learn, give back, and ...

Tech Talk | Elevating Digital Service Excellence: The Synergy of Splunk RUM & APM

Elevating Digital Service Excellence: The Synergy of Real User Monitoring and Application Performance ...

Adoption of RUM and APM at Splunk

    Unleash the power of Splunk Observability   Watch Now In this can't miss Tech Talk! The Splunk Growth ...