topic Re: How to use JavaScript code in Splunk Cloud dashboard ? in Dashboards & Visualizations

How to use JavaScript code in Splunk Cloud dashboard ?

shukan — Thu, 28 Sep 2017 10:22:41 GMT

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

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.

Re: How to use JavaScript code in Splunk Cloud dashboard ?

niketn — Mon, 02 Oct 2017 06:20:09 GMT

@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.

<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.

Re: How to use JavaScript code in Splunk Cloud dashboard ?

biju_babu — Fri, 11 Nov 2022 12:02:42 GMT

Is there a way to add the java script in xml inline?

I am using cloud version and don't have rights to add the script in path.

Re: How to use JavaScript code in Splunk Cloud dashboard ?

spunk_enthusias — Fri, 20 Jan 2023 12:39:42 GMT

I'm looking for this as well, for colocation reasons. But so far I haven't found a way.

For people playing along at home: web.conf has a few options for dashboards (like dashboard_html_allow_embeddable_content), but seemingly nothing to allow embedding scripts.