The Group Scheduling functionality of Rock is great for offering a live and up-to-date view of who is scheduled for where and when. There are some times when it would be nice to have that data somewhere else, though. Maybe you want to email a copy to someone or print a schedule out to post or mail out to volunteers. This bit of HTML and JavaScript should allow you to take your current view of the Group Schedule Status Board (selected Groups, Dates, etc.) and export it as an .xls file, so you can open it with Excel and format or print it to your heart's content.


1) Add a block

On the Group Schedule Status Board page (or wherever you have the Schedule Status Board posted), you'll need to add an HTML Content block (I'm naming it Schedule Export). It does not need to be in the same Zone as the Status Board, but it does need to be on the same page.

AddBlock.PNG

2) Insert HTML

Now you'll need to edit the content of the new HTML block. You can just copy and paste the HTML from below. You can adjust the first line to change what you want the button to say (Save Current Schedule to Excel) and what to name the downloaded file (Schedule-Status-Board-Export).

InsertHTML.PNG

CODE FOR BUTTON:
<button onclick="exportTableToExcel('tblData', 'Schedule-Status-Board-Export')">Save Current Schedule to Excel</button>
<script>
function exportTableToExcel(tableID, filename = ''){
    var downloadLink;
    var dataType = 'application/vnd.ms-excel';
    var tableSelect = document.querySelector(".table.schedule-status-board.js-schedule-status-board");
    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();
    }
}</script>

3) Save and Refresh

Click save and you should see your new button, although you'll need to refresh the page before it works. Once the page is refreshed, clicking it should download an .xls file with the contents of whatever table you had pulled up (if a group is collapsed it will still be exported).

NewButton.PNG 

Downloaded.PNGDownloaded.PNG

That's it!

The .xls file will be pretty bare as far as formatting goes, but it should be enough to add borders and quickly put together something you can print out.

Excel1.PNG

Excel2.PNG

For transparency, my coding experience is almost none, so almost this entire block of code is pulled straight from here. I mainly adjusted where it was getting the table from as the Status Board doesn't seem to have an ID attached. If there's a better way of doing some part of this please make a recipe for it or let me know and I'd be more than happy to update this one. Thanks for reading and I hope this helps!