Dashboards & Visualizations

How to export tables in dashboard to Excel format using JavaScript?

marxsabandana
Path Finder

I got this code from CodexWorld(dot)com. How can I integrate this in a Splunk dashboard?

 function exportTableToExcel(tableID, filename = ''){
        var downloadLink;
        var dataType = 'application/vnd.ms-excel';
        var tableSelect = document.getElementById(tableID);
        var tableHTML = tableSelect.outerHTML.replace(/ /g, '%20');

        // Specify file name
        filename = filename?filename+'.xls':'excel_data.xls';

        // Create download link element
        downloadLink = document.createElement("a");

        document.body.appendChild(downloadLink);

        if(navigator.msSaveOrOpenBlob){
            var blob = new Blob(['\ufeff', tableHTML], {
                type: dataType
            });
            navigator.msSaveOrOpenBlob( blob, filename);
        }else{
            // Create a link to the file
            downloadLink.href = 'data:' + dataType + ', ' + tableHTML;

            // Setting the file name
            downloadLink.download = filename;

            //triggering the function
            downloadLink.click();
        }
    }

Then I put a button wrapped in an html tag, with putting an id in my table like this:

<html>
<button class="btn btn-primary" onclick="exportTableToExcel('tableid1', 'file-name')">Export Table Data To Excel File</button>
</html>

I also already tried using the Excel Export app at Splunkbase but I need to modify the code, to make the table headers in bold font weight and have dynamic column size depending on the text length of each headers.

pramit46
Contributor

Hi @marxsabandana

Please refer this question (the requirements was almost similar) and see if it helps:
https://answers.splunk.com/answers/749857/how-to-make-a-second-download-button.html#answer-749318

I have provided an example of csv file. But you can try to change the format to xls and see if that works.

0 Karma

marxsabandana
Path Finder

Thanks. Will check on it now.

0 Karma

pramit46
Contributor

Did it help? Were you looking for anything else?

0 Karma

at1ll3y
New Member

Hi,

you have to create a javascript file in App/appserver/static/your_script_name.js.

this file has to contain this:

require([
"splunkjs/mvc/simplexml/ready!"
], function() {

PUT YOUR CODE HERE

});

To reference this javascript file in your dashboard, you have to add it the header of the dashboard like this:

0 Karma
Get Updates on the Splunk Community!

Introducing the Splunk Community Dashboard Challenge!

Welcome to Splunk Community Dashboard Challenge! This is your chance to showcase your skills in creating ...

Get the T-shirt to Prove You Survived Splunk University Bootcamp

As if Splunk University, in Las Vegas, in-person, with three days of bootcamps and labs weren’t enough, now ...

Wondering How to Build Resiliency in the Cloud?

IT leaders are choosing Splunk Cloud as an ideal cloud transformation platform to drive business resilience,  ...