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!

.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 ...

Introducing the 2024 SplunkTrust!

Hello, Splunk Community! We are beyond thrilled to announce our newest group of SplunkTrust members!  The ...