Dashboards & Visualizations

UI for checkboxgroupInput not updating when token for same is updated in javascript.

lyndac
Contributor

I am creating a form (Simple XML converted to HTML) in Splunk 6.3.1. I am allowing the user to select which fields are returned in the table. To do this, I have a search which pulls values from a kv_store lookup to populate the choices of a checkboxGroup named "reportCriteria". There are no static choices. I also have a second checkboxGroup with one static options to let the user Select/Deselect All choices from the 1st group.

When the user clicks on "Select All", I update the token associated with the reportCriteria to include all of the possible choices. If they then uncheck Select All, I set the token for reportCriteria to an empty string. I know that the token replacement is working because the search that is run has the correct fields returned.

The issue is that the UI does not change when I "select all". I thought that if I updated the token for the checkbox group, it would trigger a change to each of the checkboxes in the group so that they would now appear checked. They do not. Oddly, when I "unselect all", the check marks do clear from all the previously selected items.

Here is the relevant code:

var reportfields = [];
var search2=new SearchManager({
  "id": "search2",
  "search": "|inputlookup ysfields_lu | sort label",
  "cancelOnUnload": true,
  ...}, {tokens:true});

//when the search completes store the results in a variable.
var myResults = search2.data("results);
myResults.on("data", function() {
    reportFields = myResults.data().rows;
});

//checkbox group --one checkbox for each field option
var reportCriteria = new CheckboxGroupInput({
  "id": "reportCriteria",
  "choices":  [],
  "searchWhenChanged": false,
  "valueField": "fieldname",
  "labelField": "label",
  "managerid": "search2",
  "value": "$report_fields_tok$",
  "el": $('reportCriteria')
}, {tokens:true}).render();

reportCriteria.on("change", function(newValue) {
  FormUtils.handleValueChange(reportCriteria);
}

var selectall = new CheckboxGroupInput({
  "id": "selectall",
  "choices": [{"value":"selall", "label": "Select All")],
  "searchWhenChanged": false,
  "el" : $('#selectall')
}, {tokens:true}).render();

selectall.on("change", function() {
  if (selectall.val().length == 0) {
    setToken("report_fields_tok", "");
  } else {
    var str="";
    for (i=0;i< reportfields.length; i++){
        var f = reportfields[i];
        if (i !=0){ str += ",";}
        str += f[2];
    }
    setToken("report_fields_tok", str);
  }
});

How do I make the UI update with the new token values? Or, as an alternative way, I thought about trying to explicitly check each checkbox in the report criteria group, but I can't figure out how to get to them. Does anyone know how to do that?

0 Karma
1 Solution

lyndac
Contributor

So I feel really stupid, but I found the issue like 5 minutes after posting this message! ugh. I was setting the token as a string, but the token for the checkboxGroupInput is an array of values. So I changed the one method like this:

 selectall.on("change", function() {
   if (selectall.val().length == 0) {
     setToken("report_fields_tok", []);
   } else {
     var str=[];
     for (i=0;i< reportfields.length; i++){
         var f = reportfields[i];
         str.push( f[2]);
     }
     setToken("report_fields_tok", str);
   }
 });

and now things are working correctly. I want to just delete this question, but maybe someday someone will have the same issue...

View solution in original post

0 Karma

lyndac
Contributor

So I feel really stupid, but I found the issue like 5 minutes after posting this message! ugh. I was setting the token as a string, but the token for the checkboxGroupInput is an array of values. So I changed the one method like this:

 selectall.on("change", function() {
   if (selectall.val().length == 0) {
     setToken("report_fields_tok", []);
   } else {
     var str=[];
     for (i=0;i< reportfields.length; i++){
         var f = reportfields[i];
         str.push( f[2]);
     }
     setToken("report_fields_tok", str);
   }
 });

and now things are working correctly. I want to just delete this question, but maybe someday someone will have the same issue...

0 Karma

martin_mueller
SplunkTrust
SplunkTrust

Have you tried unsetToken(1)?

0 Karma
Get Updates on the Splunk Community!

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

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