Dashboards & Visualizations

How to use JavaScript code in Splunk Cloud dashboard ?

Explorer

I would like to fetch query string value through script in splunk cloud dashboard or in report so how it can be possible ?

For ex. www.splunkcloud.com ? q=TRY

Dashboard source code of cloud

alt text
I am not able to call any script. its giving error.

If i want to use q's value TRY in any search query like report,chart,dashboard then how it is possible?

Thanks in advance.

0 Karma

Legend

@shukan, While you can use <style> tag directly in Splunk Simple XML dashboards to load/override CSS style, Javascript does not work this way. You will need to use Simple XML JS Extension.

There are several examples on Splunk Dashboard Examples app on Splunkbase ( https://splunkbase.splunk.com/app/1603/ )
You can also refer to Splunk Dev site for the same: http://dev.splunk.com/view/SP-CAAAE4A#editjs

Following is an example of dashboard which uses hello_world.jsJavaScript file.

alt text

<dashboard script="hello_world.js">
  <label>Hello World JavaScript Example</label>
  <row>
    <panel>
      <html>
        <div>
          Splunk Simple XML JavaScript Extension to show Hello World alert and console log using JavaScript file <b>hello_world.js</b>.
          The JavaScrpt File needs to be placed under the Splunk App's Static folder i.e. <b>$SPLUNK_HOME$/apps/etc/$env:app$/appserver/static</b>, based on the current app <b>$env:app$</b>.
        </div><br/>
        <div>
          Following is the JavaScript Code:<br/><br/> 
          <code>
            require([
                "splunkjs/mvc/simplexml/ready!"
            ], function() {
              alert("Hello World");
                console.log("Console Log: Hello World");
            });
          </code><br/><br/>
          PS: Press <code>F12</code> to Open Browser Inspect Tool to view JavaScript console log. 
        </div>
      </html>
    </panel>
  </row>
</dashboard>

Following is the code for JavaScript file which needs to be placed under your Splunk app's static folder:

        require([
            "splunkjs/mvc/simplexml/ready!"
        ], function() {
            alert("Hello World");
            console.log("Console Log: Hello World");
        });

PS: If you want to load Static files like Javascript file on Splunk Cloud you should test the same on your local Splunk Instance and then reach out to Splunk Support for getting the same uploaded to your Splunk Cloud instance.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma
State of Splunk Careers

Access the Splunk Careers Report to see real data that shows how Splunk mastery increases your value and job satisfaction.

Find out what your skills are worth!