Solved: How to use SplunkJS to automatically "select all" ...

xuehui · ‎07-07-2019

I want to add a button for a checkbox group, so that when I click the button all the checkboxes will be selected.
How can I do this by using SplunkJS?

vnravikumar · ‎07-08-2019

Hi

Try this

<form script="checkbox.js">
  <label>checkbox</label>
  <fieldset submitButton="false">
    <input type="checkbox" token="sports" id="rk">
      <label>Sports</label>
      <choice value="football">Football</choice>
      <choice value="baseball">Baseball</choice>
      <choice value="cricket">Cricket</choice>
      <choice value="boxing">Boxing</choice>
    </input>
  </fieldset>
  <row>
    <html>
      <div>
        <button id="all">Select All</button>
      </div>
    </html>
  </row>
</form>

js:

require([
    'underscore',
    'jquery',
    'splunkjs/mvc',
    'splunkjs/mvc/simplexml/ready!'
], function(_, $, mvc) {
    $(document).ready(function(){
        $("#all").click(function(){
           var checkbox= mvc.Components.get("rk");
           var temp=[];
          var dictionary = checkbox.settings.get("choices");
           Object.keys(dictionary).forEach(function(key) {
               var checkboxvalues =  Object.values(dictionary[key].value).join("");
               temp.push(checkboxvalues);
        });
        checkbox.val(temp);
        });
    });
});

View solution in original post

vnravikumar · ‎07-08-2019

Hi

Try this

<form script="checkbox.js">
  <label>checkbox</label>
  <fieldset submitButton="false">
    <input type="checkbox" token="sports" id="rk">
      <label>Sports</label>
      <choice value="football">Football</choice>
      <choice value="baseball">Baseball</choice>
      <choice value="cricket">Cricket</choice>
      <choice value="boxing">Boxing</choice>
    </input>
  </fieldset>
  <row>
    <html>
      <div>
        <button id="all">Select All</button>
      </div>
    </html>
  </row>
</form>

js:

require([
    'underscore',
    'jquery',
    'splunkjs/mvc',
    'splunkjs/mvc/simplexml/ready!'
], function(_, $, mvc) {
    $(document).ready(function(){
        $("#all").click(function(){
           var checkbox= mvc.Components.get("rk");
           var temp=[];
          var dictionary = checkbox.settings.get("choices");
           Object.keys(dictionary).forEach(function(key) {
               var checkboxvalues =  Object.values(dictionary[key].value).join("");
               temp.push(checkboxvalues);
        });
        checkbox.val(temp);
        });
    });
});

prashanthberam · ‎06-14-2020

I Have similar problem but when we have multiple checkboxes in dashboard with different id's for each checkbox, How can we select/Deselect All checkboxes at time. below my sample xml code

<input type="checkbox" id="rk1" token="field1">
<label>Select/Unselect ALL</label>
<choice value="1">2</choice>
<delimiter> </delimiter>
</input>
<input type="checkbox" id="rk2" token="field2">
<label>Check3</label>
<choice value="chicago">chicago1</choice>
</input>
<input type="checkbox" id="rk3" token="field3">
<label>check3</label>
<choice value="Detriot">detroit1</choice>
</input>

xuehui · ‎07-09-2019

Thank you very much for your answer. I tried. It's okey.
but now,I hava a new question.
Q:when the checkboxgroup's options was creted by SPL, how can i get all options.
The following command has no effect.
[var dictionary = checkbox.settings.get("choices");]

xuehui · ‎07-09-2019

i implemented my function with the following JS:

var clsWfResults = search1.data("preview");
clsWfResults.on("data", function() {
var i = 0;
while (clsWfResults.data().rows[i][0] != "") {
array[i] = clsWfResults.data().rows[i][0];
i++;
}
});

$("#all_check_button").on("click",function(){
splunkjs.mvc.Components.get("input1").val(array);
});

$("#all_clear_button").on("click",function(){

splunkjs.mvc.Components.get("input1").val(null);
});

How to use SplunkJS to automatically "select all" checkboxes in a group?

SplunkJS

visualization

Introducing Ingest Actions: Filter, Mask, Route, Repeat

Splunk Forwarders and Forced Time Based Load Balancing

NEW! Log Views in Splunk Observability Dashboards Gives Context From a Single Page