Export Kendo grid to csv (jeastburn)

Export a Kendo grid to csv for opening in Excel (jeastburn)

by Josh Eastburn

HTML

<script src="http://cdn.kendostatic.com/2013.2.918/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.common.min.css">
<script src="https://rawgithub.com/uber-rob/kendo-grid-csv-download/master/kendo.grid.csv.download.js"></script>
<script src="https://rawgithub.com/eligrey/FileSaver.js/master/FileSaver.js"></script>
<button data-bind="click:saveGridCsv">Download to CSV</button>
<div id="test-grid" data-role="grid"  data-bind="source: remoteSource" 
         data-columns='[
                { 
					field: "user.screen_name",
					title: "User"
				} , 
				{ 
					field: "text", 
					title: "Text"
				}
            ]'></div>

JavaScript

(function () {
    var log = (function (el) {
        return function (text) {
            el.html(el.html() + '<br/>' + text);
        };
    })($('#log'));

    var viewModel = kendo.observable({
        
    saveGridCsv: function () {
        viewModel.exportCsv('test-grid', 'testdata.csv');
        },

    // the remote datasource    
    remoteSource: new kendo.data.DataSource({
                transport: {
                    read: {
                        dataType: "jsonp",
                        url:"http://demos.kendoui.com/service/Twitter/Search?q=kendoui",
                        data: function (response) {
                            return [response];
                        }
                    }
                },
                schema: { 
					data: function(data) { 
						return data.statuses || [];
					},			
				},
            }),
        
        exportCsv: function (gridId, fileName) {
             var grid = $("#" + gridId).data("kendoGrid");
                var originalPageSize = grid.dataSource.pageSize();
                var csv = '';
                fileName = fileName || 'download.csv';

                // Increase page size to cover all the data and get a reference to that data
                grid.dataSource.pageSize(grid.dataSource.view().length);
                var data = grid.dataSource.view();

                //add the header row
                for (var i = 0; i < grid.columns.length; i++) {
                    var field = grid.columns[i].field;
                    var title = grid.columns[i].title || field;

                    //NO DATA
                    if (!field) continue;

                    title = title.replace(/"/g, '""');
                    csv += '"' + title + '"';
                    if (i < grid.columns.length - 1) {
                        csv += ',';
                    }
                }
                csv += '\n';

                //add each row of data
                for (var row in data) {
        ...