The Dropdown view displays a dropdown list with a set of choices. The list can be bound to a search manager, but can also be used as a standard HTML dropdown list that emits change events.
Name | Default value | Description |
id | Required. The unique ID for this control. | |
choices | [] | A static dictionary of options for the dropdown list. Must be set in JavaScript. If bound to a managerid, the static choices specified here are prepended to the dynamic choices from the search. For example: var mychoices = [ {label:"text1", value: "value1"}, {label:"text2", value: "value2"}, {label:"text3", value: "value3"} ]; |
default | The default choice. | |
disabled | false | Indicates whether to disable the view. |
labelField | "" | The UI label to display for each choice. |
managerid | null | The ID of the search manager to bind this view to. |
minimumResultsForSearch | 8 | The minimum number of results. |
selectFirstChoice | "false" | Indicates whether to use the first available choice when the user has not made a selection. If the default property has been set, that value is used instead. |
showClearButton | true | Indicates whether to display that "x" next to choices, allowing a selection to be cleared. |
value | The value of the current choice. | |
valueField | "" | The value or search field for each choice. |
width | 200 | The width of the view, in pixels. |
Name | Description |
render | Draws the view to the screen. Called only when you create the view manually in JavaScript. |
val | Returns the view's value if passed no parameters. Sets the view's value if passed a single parameter. |
Name | Description |
change | Fired when the value of the view changes. |
{% dropdown id="example-dropdown" managerid="example-search" default="main" %}
<script> var deps = [ "splunkjs/ready!", "splunkjs/mvc/searchmanager", "splunkjs/mvc/dropdownview" ]; require(deps, function(mvc) { var SearchManager = require("splunkjs/mvc/searchmanager"); var DropdownView = require("splunkjs/mvc/dropdownview"); // Use this search to populate the dropdown with index values new SearchManager({ id: "example-search", search: "| eventcount summarize=false index=* index=_* | dedup index | fields index" }); // Instantiate components new DropdownView({ id: "example-dropdown", managerid: "example-search", default: "main", labelField: "index", valueField: "index", el: $("#mydropdownview") }).render(); }); </script>