How to change token value in JS ?

[nrogatov]

I have simple form in HTML
i need to change value my token $srcb$ i did as i read in documentation splunk JS but result is - unifined value (((

what i do wrong ?

<script src="{{SPLUNKWEB_URL_PREFIX}}/config?autoload=1"></script>
<script src="{{SPLUNKWEB_URL_PREFIX}}/static/js/i18n.js"></script>
<script src="{{SPLUNKWEB_URL_PREFIX}}/i18ncatalog?autoload=1"></script>
<script src="{{SPLUNKWEB_URL_PREFIX}}/static/js/build/simplexml.min/config.js"></script>
<script type="text/javascript">
require.config({
    baseUrl: "{{SPLUNKWEB_URL_PREFIX}}/static/js",
    waitSeconds: 0 // Disable require.js load timeout
});

//
// LIBRARY REQUIREMENTS
//
// In the require function, we include the necessary libraries and modules for
// the HTML dashboard. Then, we pass variable names for these libraries and
// modules as function parameters, in order.
// 
// When you add libraries or modules, remember to retain this mapping order
// between the library or module and its function parameter. You can do this by
// adding to the end of these lists, as shown in the commented examples below.

require([
    "splunkjs/mvc",
    "splunkjs/mvc/utils",
    "splunkjs/mvc/tokenutils",
    "underscore",
    "jquery",
    "splunkjs/mvc/simplexml",
    "splunkjs/mvc/headerview",
    "splunkjs/mvc/footerview",
    "splunkjs/mvc/simplexml/dashboardview",
    "splunkjs/mvc/simplexml/element/chart",
    "splunkjs/mvc/simplexml/element/event",
    "splunkjs/mvc/simplexml/element/html",
    "splunkjs/mvc/simplexml/element/list",
    "splunkjs/mvc/simplexml/element/map",
    "splunkjs/mvc/simplexml/element/single",
    "splunkjs/mvc/simplexml/element/table",
    "splunkjs/mvc/simpleform/formutils",
    "splunkjs/mvc/simpleform/input/dropdown",
    "splunkjs/mvc/simpleform/input/radiogroup",
    "splunkjs/mvc/simpleform/input/multiselect",
    "splunkjs/mvc/simpleform/input/checkboxgroup",
    "splunkjs/mvc/simpleform/input/text",
    "splunkjs/mvc/simpleform/input/timerange",
    "splunkjs/mvc/simpleform/input/submit",
    "splunkjs/mvc/searchmanager",
    "splunkjs/mvc/savedsearchmanager",
    "splunkjs/mvc/postprocessmanager",
    "splunkjs/mvc/simplexml/urltokenmodel"
    // Add comma-separated libraries and modules manually here, for example:
    // ..."splunkjs/mvc/simplexml/urltokenmodel",
    // "splunkjs/mvc/checkboxview"
    ],
    function(
        mvc,
        utils,
        TokenUtils,
        _,
        $,
        DashboardController,
        HeaderView,
        FooterView,
        Dashboard,
        ChartElement,
        EventElement,
        HtmlElement,
        ListElement,
        MapElement,
        SingleElement,
        TableElement,
        FormUtils,
        DropdownInput,
        RadioGroupInput,
        MultiSelectInput,
        CheckboxGroupInput,
        TextInput,
        TimeRangeInput,
        SubmitButton,
        SearchManager,
        SavedSearchManager,
        PostProcessManager,
        UrlTokenModel

        // Add comma-separated parameter names here, for example: 
        // ...UrlTokenModel, 
        // CheckboxView
        ) {



        var pageLoading = true;


        // 
        // TOKENS
        //

        // Create token namespaces
        var urlTokenModel = new UrlTokenModel();
        mvc.Components.registerInstance('url', urlTokenModel);
        var defaultTokenModel = mvc.Components.getInstance('default', {create: true});
        var submittedTokenModel = mvc.Components.getInstance('submitted', {create: true});

        urlTokenModel.on('url:navigate', function() {
            defaultTokenModel.set(urlTokenModel.toJSON());
            if (!_.isEmpty(urlTokenModel.toJSON()) && !_.all(urlTokenModel.toJSON(), _.isUndefined)) {
                submitTokens();
            } else {
                submittedTokenModel.clear();
            }
        });

        // Initialize tokens
        defaultTokenModel.set(urlTokenModel.toJSON());

        function submitTokens() {
            // Copy the contents of the defaultTokenModel to the submittedTokenModel and urlTokenModel
                    mytoken = defaultTokenModel.get("srcb");

            FormUtils.submitForm({ replaceState: pageLoading });


        }

        function setToken(name, value) {
            defaultTokenModel.set(name, value);
            submittedTokenModel.set(name, value);
        }

        function unsetToken(name) {
            defaultTokenModel.unset(name);
            submittedTokenModel.unset(name);
        }


        **// Access the "default" token model
var tokens = mvc.Components.getInstance("default");
// Retrieve the value of a token $mytoken$
var mytoken = tokens.get("srcb");**


        //
        // SEARCH MANAGERS
        //
        var index_de = "index=" + mytoken;

  //AFTER THIS LINE  VALUE NO PRESENT, I SEE UNDEFINED
        var search1 = new SearchManager({
            "id": "search1",
            "status_buckets": 0,
            "search": index_de,
            "earliest_time": "0",
            "cancelOnUnload": true,
            "latest_time": "",
            "app": utils.getCurrentApp(),
            "auto_cancel": 90,
            "preview": true,
            "runWhenTimeIsUndefined": false
        }, {tokens: true, tokenNamespace: "submitted"});



        //
        // SPLUNK HEADER AND FOOTER
        //

        new HeaderView({
            id: 'header',
            section: 'dashboards',
            el: $('.header'),
            acceleratedAppNav: true,
            useSessionStorageCache: true
        }, {tokens: true}).render();

        new FooterView({
            id: 'footer',
            el: $('.footer')
        }, {tokens: true}).render();


        //
        // DASHBOARD EDITOR
        //

        new Dashboard({
            id: 'dashboard',
            el: $('.dashboard-body')
        }, {tokens: true}).render();


        //
        // VIEWS: VISUALIZATION ELEMENTS
        //

        var element1 = new ChartElement({
            "id": "element1",
            "resizable": true,
            "managerid": "search1",
            "el": $('#element1')
        }, {tokens: true}).render();




        //
        // VIEWS: FORM INPUTS
        //
        var field1 = new TextInput({
            "id": "field1",
            "searchWhenChanged": true,
            "value": "$form.srcb$",
            "el": $('#field1')
        }, {tokens: true}).render();

        field1.on("change", function(newValue) {
            FormUtils.handleValueChange(field1);
        });


        // Initialize time tokens to default
        if (!defaultTokenModel.has('earliest') && !defaultTokenModel.has('latest')) {
            defaultTokenModel.set({ earliest: '0', latest: '' });
        }

        if (!_.isEmpty(urlTokenModel.toJSON())){
            submitTokens();
        }


        //
        // DASHBOARD READY
        //

        DashboardController.ready();
        pageLoading = false;

    }
);
</script>
</body>
</html>

[trsavela]

I've had success with this:

    submittedTokens.set('token_name','value');
    unsubmittedTokens.set('token_name','value.);

[MisteRious]

Works fine for me, unless I want multiple values in a token (to use in MultiSelectView's)

[Raghav2384]

I have used token.js from the dashboard examples app and referenced that in my dashboards. Not sure how similar it is with your requirement but, it works fine for me. Here's the working xml references.

XYZ

<input type="dropdown" token="earliestTime" searchWhenChanged="true">
  <label>Select a TimeWindow</label>
   <choice value="-24h@h">24 Hour Window</choice>
<choice value="-48h@h">48 Hour Window</choice>
<choice value="-72h@h">72 Hour Window</choice>
<choice value="-7d@d">7 Day Window</choice>
<default>24 Hour Window</default>

</input>


<panel>
  <html>
    <p><h2 style="color:Red;"> Displaying $earliestTime$ Data</h2></p>
  </html>
</panel>

Please provide the actual xml references if you have made any for the scrb. Alo, i would recommend you to go through the 6.2 dashboard examples.

Thanks,
Raghav

[nrogatov]

Thanks for answer Ragnav, i want something other .. user input value (for example 42), but for search i input value + something (for example 42+5=47)