SearchBarView
Description
The SearchBar view provides a search query and a built-in TimeRange view for controlling a search manager.
Note To allow the SearchBar view to modify its search manager, you must use tokens or set up a change handler as shown in the examples below.
Library path
splunkjs/mvc/searchbarview
Properties
Name | Default value | Description |
id | | Required. The unique ID for this control. |
default | | The default value. |
managerid | null | The ID of the search manager to bind this view to. |
settings | | The properties of the view. See the methods below to get and set values. |
timerange_* | | Dynamic properties of the internal timerange created by the search bar. For example, timerange_value corresponds to the value property of the internal timerange. |
timerange | true | Indicates whether to display a TimeRange view. |
value | | The current value of the search bar. |
Methods
Name | Description |
render | Draws the view to the screen. Called only when you create the view manually. |
settings.get( property ) | Returns the value of property for the current component. |
settings.set( property, value ) | Sets the value of property to the specified value for the current component. |
val | Returns the view's value if passed no parameters. Sets the view's value if passed a single parameter. |
Events
Name | Description |
change | Fired when the value of the view changes. |
Example
require([
"splunkjs/mvc/searchmanager",
"splunkjs/mvc/searchbarview",
"splunkjs/mvc/simplexml/ready!"
], function(SearchManager, SearchBarView) {
// Create the search manager
var mysearch = new SearchManager({
id: "example-search",
status_buckets: 300,
required_field_list: "*",
preview: true,
cache: true,
autostart: false, // Prevent the search from running automatically
search: "index=_internal | head 500"
});
// Create the searchbar
var mysearchbar = new SearchBarView({
id: "example-searchbar",
managerid: "example-search",
el: $("#mysearchbarview")
}).render();
// Listen for changes to the search query portion of the searchbar
mysearchbar.on("change", function() {
// Reset the search query (allows the search to run again,
// even when the query is unchanged)
mysearch.settings.unset("search");
// Update the search query
mysearch.settings.set("search", mysearchbar.val());
// Run the search (because autostart=false)
mysearch.startSearch();
});
// Listen for changes to the built-in timerange portion of the searchbar
mysearchbar.timerange.on("change", function() {
// Update the time range of the search
mysearch.settings.set(mysearchbar.timerange.val());
// Run the search (because autostart=false)
mysearch.startSearch();
});
});