All Apps and Add-ons

In HTML Dashboards, can token forwarding be used with a submit button?

lyndac
Contributor

I am following this example to use token forwarding in my HTML dashboard. I need to do some fancy things with the inputs selected to generate the correct search. The token forwarding is working nicely, but it submits the search every time a token changes. I only want to submit the search when the user presses the submit button. Is this possible?

The majority of the code is code generated when I did "convert to HTML". These are the relevant changes from that generated code:

var search1 = new SearchManager({
            "id": "search1",
            "status_buckets": 0,
            "earliest_time":"$timer_tok.earliest$",
            "latest_time": "$timer_tok.latest$",
            "cancelOnUnload": true,
            "search": "$searchQuery$",
            "earliest_time": "0",
            "app": utils.getCurrentApp(),
            "auto_cancel": 90,
            "preview": true,
            "runWhenTimeIsUndefined": false
        }, {tokens: true}); 

// Code to generate inputs and table go here.  I have multiple
// inputs that are either dropdown or text box.  I pass them all
//to the token forwarder and return a search string.  This is a simplified
// method call:
    new TokenForwarder(['$where_tok$', '$name_tok$', '$host_tok$'], '$searchQuery$', function(where_tok, name_tok, host_tok) {
           return "index=foo +" name_tok + " " + where_tok + " | stats count by " + host_tok
    });

    var submit = new SubmitButton({
        id: 'submit', el: $('#search_btn') }, {tokens:true}).render();

    submit.on("submit", function() {
        submitTokens();
    });

     //The example adds this function.  I commented it out thinking it would
     // not run the search just because the tokens are set.  It had no effect 
     // that I could see.
    //defaultTokenModel.on("change.searchQuery", function () {
    //      search1.startSearch();
    //});

    submitTokens();

   //DASHBOARD READY ...
0 Karma
1 Solution

lyndac
Contributor

The example is written to not have a submit button. To modify it to respect the submit button, you need to tell the search manager to only run when the tokens are submitted. To do this add 'tokenNamespace: "submitted"' to the search manager definition like below.

 var search1 = new SearchManager({
             "id": "search1",
             "status_buckets": 0,
             "earliest_time":"$timer_tok.earliest$",
             "latest_time": "$timer_tok.latest$",
             "cancelOnUnload": true,
             "search": "$searchQuery$",
             "earliest_time": "0",
             "app": utils.getCurrentApp(),
             "auto_cancel": 90,
             "preview": true,
             "runWhenTimeIsUndefined": false
         }, {tokens: true, tokenNamespace: "submitted"});  //make search respect the submit button

View solution in original post

0 Karma

lyndac
Contributor

The example is written to not have a submit button. To modify it to respect the submit button, you need to tell the search manager to only run when the tokens are submitted. To do this add 'tokenNamespace: "submitted"' to the search manager definition like below.

 var search1 = new SearchManager({
             "id": "search1",
             "status_buckets": 0,
             "earliest_time":"$timer_tok.earliest$",
             "latest_time": "$timer_tok.latest$",
             "cancelOnUnload": true,
             "search": "$searchQuery$",
             "earliest_time": "0",
             "app": utils.getCurrentApp(),
             "auto_cancel": 90,
             "preview": true,
             "runWhenTimeIsUndefined": false
         }, {tokens: true, tokenNamespace: "submitted"});  //make search respect the submit button
0 Karma
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...