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!

Webinar Recap | Revolutionizing IT Operations: The Transformative Power of AI and ML ...

The Transformative Power of AI and ML in Enhancing Observability   In the realm of IT operations, the ...

.conf24 | Registration Open!

Hello, hello! I come bearing good news: Registration for .conf24 is now open!   conf is Splunk’s rad annual ...

ICYMI - Check out the latest releases of Splunk Edge Processor

Splunk is pleased to announce the latest enhancements to Splunk Edge Processor.  HEC Receiver authorization ...