Dashboards & Visualizations

How do I reset form input fields to their default value on-click of a button on a Splunk 6.3.1 HTML dashboard?

lyndac
Contributor

I am creating a form (Simple XML converted to HTML) in Splunk 6.3.1. The form contains several form inputs, including drop-down, checkbox group, text, and radio button. Since there are several inputs, I want to give the user a way to reset all of the inputs to their default values. I have added a "Reset" button to my form and given it an "on" submit function in javascript. (see code below). In the function, I call defaultTokenModel.clear(). This does clear all the tokens, but leaves all the inputs in a state where there is no default selection. How can I make all the inputs go back to their default values?

The code below shows a drop-down with choices of =, !=, <, >. The default value when the form is loaded is =. If I press my reset button (which calls defaultTokenModel.clear()), the drop-down goes to a state where nothing is selected. I want to make it show the default value.

var input24 = new DropdownInput({
    "id": "input24",
    "choices": [
         {"value": "=", "label": "="},
         {"value": "!=", "label": "!="},
         {"value": ">", "label": ">"},
         {"value": "<", "label": "<"},
    "default": "=",
    "searchWhenChanged": false,
    "showClearButton":true,
    "value": "$op_tok$",
    "el": $('#input24')
}), {tokens: true}).render();

    var resetBtn = new SubmitButton({
        id: 'reset',
      text: 'Reset',
        el: $('#reset_btn')
    }, {tokens: true}).render();

    resetBtn.on("submit", function() {
        submittedTokenModel.clear();
        defaultTokenModel.clear();
    });

wkupersa
Path Finder

any way to do this in simple XML?

0 Karma

niketn
Legend

You can use <unset> token to unset the tokens (including form tokens). Each token would need one <unset> node. However, you can do so by using one of Splunk's inputs if you do not want to use JavaScript. If you need a Button to reset the tokens, you would need to code Button Click handler through JavaScript.

http://docs.splunk.com/Documentation/Splunk/latest/Viz/EventHandlerReference#unset

@wkupersa, if you face any issue while implementing unset token block using Simple XML, I would request you to post a new question with the required details specific to your use case and community members would be able to assist!

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

wkupersa
Path Finder

Thanks! That is what I arrived at. I found this example to include the button handler in the simple XML dashboard. https://answers.splunk.com/answers/581652/how-can-i-create-a-button-switcher.html

0 Karma

niketn
Legend

@wkupersa, that is one of my older posts controlling tokens through Button click via JavaScript. If you found it useful do up vote 🙂

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma

wkupersa
Path Finder

Why so it is! You are everywhere! upvoted.

0 Karma

spammenot66
Contributor

how about putting a link on your dashboard pointing to same dashboard. This will force it to reload everything with default setting. Don't forget to replace {dashboard_filename} with the your actual dashboard file name/URL.

<html>
       <a href="{dashboard_filename}" class="reset_btn">Reset Dashboard</a>
       <style>

          .reset_btn{

              border-radius: 5px;
              font-size: 12px; 

              font-family:"Roboto","Droid","Helvetica Neue",Helvetica,Arial,sans-serif;
              text-decoration: none;
              background-color: #EEEEEE;
              color: #333333;
              padding: 6px 8px 6px 8px;
              border-top: 1px solid #CCCCCC;
              border-right: 1px solid #333333;
              border-bottom: 1px solid #333333;
              border-left: 1px solid #CCCCCC;
            }

      </style>

     </html>
0 Karma

Dawson014
Path Finder

I downvoted this post because answer is not convenient

0 Karma

sundareshr
Legend

Try this

resetBtn.on("submit", function() {
    defaultTokenModel.set(urlTokenModel.toJSON());
    console.log(urlTokenModel.toJSON());
     });
0 Karma

Dawson014
Path Finder

I downvoted this post because this does not work

0 Karma

lyndac
Contributor

That doesn't seem to have any effect. The output was:

Object { form.timer_tok.earliest: "-24h@h", form.timer_tok.latest: "now", earliest: "0", latest: ""}

0 Karma
Get Updates on the Splunk Community!

What's new in Splunk Cloud Platform 9.1.2312?

Hi Splunky people! We are excited to share the newest updates in Splunk Cloud Platform 9.1.2312! Analysts can ...

What’s New in Splunk Security Essentials 3.8.0?

Splunk Security Essentials (SSE) is an app that can amplify the power of your existing Splunk Cloud Platform, ...

Let’s Get You Certified – Vegas-Style at .conf24

Are you ready to level up your Splunk game? Then, let’s get you certified live at .conf24 – our annual user ...