CheckboxGroupView

The CheckboxGroup view

Description

The CheckboxGroup view displays a group of checkboxes, allowing you to populate a set of checkboxes with a search. You can also use this view like a standard HTML checkbox group.

Documentation

Library path

Properties

Name

Default value

Description

id Required. The unique ID for this control.
choices[]A static dictionary of options for the checkbox group. Must be set in JavaScript. If bound to a managerid, the static choices specified here are prepended to the dynamic choices from the search.
defaultThe value of the options that are selected by default. If setting this in a template tag, use a comma-separated list. If setting this in JavaScript, use an array.
disabledfalseIndicates whether to disable the view.
labelField""The text or search field to use as the labels for the checkboxes in this group. If labelField is not defined, the valueField is used as the label.
manageridnullThe ID of the search manager to bind this control to.
valueA comma-separated list of values that are currently selected.
valueField""The value, or search field to provide the value, for the checkboxes in this group.

Methods

Name

Description

renderDraws the control to the screen. Called only when you create the control manually in JavaScript.
valReturns an array of values for the checked items if passed no parameters. Sets the checked items if passed an array of values.

Events

Name

Description

changeFired when the value of the view changes.

Example (Django tag)

{% checkboxgroup id="example-checkboxgroup" default="One, Three" %}

Example (JavaScript)

<script>
    var deps = [
        "splunkjs/ready!",
        "splunkjs/mvc/checkboxgroupview"
    ];
    require(deps, function(mvc) {
        var CheckboxGroupView = require("splunkjs/mvc/checkboxgroupview");

        // Instantiate components
        new CheckboxGroupView({
            id: "example-checkboxgroup",
            default: "One, Three",
            el: $("#mycheckboxgroupview")
        }).render();

        // Define choices
        var choices = [
            {label: "One", value: "One"},
            {label:" Two", value: "Two"},
            {label:" Three", value: "Three"}];
         
        // Assign choices to the checkbox group
        splunkjs.mvc.Components.getInstance("example-checkboxgroup").settings.set("choices", choices); 
    });
</script>

Code examples