Example: Search controls using tokens using a Simple XML extension

This example uses a Simple XML extension to sync search controls to a search manager using token variables.


To use this code:

  1. Save the XML file under an existing app in $SPLUNK_HOME/etc/apps/app_name/local/data/ui/views/.
  2. Save the JS file under $SPLUNK_HOME/etc/apps/app_name/appserver/static/.
  3. Restart Splunk.
  4. Open Splunk Web and view the dashboard in your app. For example, to view myexample in mysplunkapp, go to http://<localhost:port>/app/mysplunkapp/myexample.


<dashboard script="example_searchcontrolstokens.js">
  <label>Search controls and tokens</label>
            <div class="main-area">
                <p>This example shows how to set up SearchBar and SearchControls views and sync them with a SearchManager using tokens.</p>
                <p><b>Note:</b> The Timeline view can't be synced using tokens. Use events instead.</p>
                <div id="mysearchbar1"></div>
                <div id="mysearchcontrols1"></div>
                <div id="mytable1"></div>


], function(
) {

    // Create the search manager and views
    var mysearch = new SearchManager({
        id: "search1",
        search: mvc.tokenSafe("$searchquery$"),
        earliest_time: mvc.tokenSafe("$earlyval$"),
        latest_time: mvc.tokenSafe("$lateval$"),
        app: "search",
        preview: true,
        required_field_list: "*",
        status_buckets: 300

    var mysearchbar = new SearchbarView({
        id: "searchbar1",
        managerid: "search1",
        value: mvc.tokenSafe("$searchquery$"),
        timerange_earliest_time: mvc.tokenSafe("$earlyval$"),
        timerange_latest_time: mvc.tokenSafe("$lateval$"),
        default: "index=_internal | head 100",
        el: $("#mysearchbar1")

    var mysearchcontrols = new SearchControlsView({
        id: "searchcontrols1",
        managerid: "search1",
        el: $("#mysearchcontrols1")

    var mytable = new TableView({
        id: "table1",
        managerid: "search1",
        el: $("#mytable1")