Kendo grid-column templating

<!DOCTYPE html>
<html>
<head>
    <title></title>
   
    <link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.common.min.css" rel="stylesheet">
    <link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
    <script src="//code.angularjs.org/1.1.4/angular.js"></script>
    <script src="http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js"></script>
    
    <script src="kendo.grid.csv.download.js"></script>
    <script src="script.js"></script>
    
</head>
<body>
        
        <div id="test-grid" data-role="grid"  data-bind="source: testDataSource" 
         data-columns='[
                { 
					field: "Site",
					title: "Site"
				} , 
				{ 
					title: "Action",
					template: kendo.template($("#conditional-action-template").html())
					
				}
				
            ]'></div>

      <div id="log"></div>

      <script id="conditional-action-template" type="text/x-kendo-template">
          # if(FirstActionEnabled) { #
          <div class='action circle' data-bind="click: firstActionClick"></div>
          # } #
          # if(SecondActionEnabled) { #
          <div class='action square' data-bind="click: secondActionClick"></div>
          # } #
      </script>



</body>
</html>

(function () {

    var log = (function (el) {
        return function (text) {
            el.html(el.html() + '<br/>' + text);
        };
    })($('#log'));
    
    var viewModel = kendo.observable({
        
    // the test data  
    testDataSource: new kendo.data.DataSource({
                schema: { 
					data: function() { 
                        return [{Site: 'Falafel Home', 
                                 FirstActionEnabled: true, SecondActionEnabled: false},
                               {Site: 'Kendo UI Demos', 
                                 FirstActionEnabled: false, SecondActionEnabled: true},
                               {Site: 'Telerik Home', 
                                 FirstActionEnabled: true, SecondActionEnabled: true}]
					},			
				},
            }),
        firstActionClick: function(item){
            log('First action selected for ' + item.data.Site)
        },
        secondActionClick: function(item){
            log('Second action selected ' + item.data.Site)
        }
      
    })
    // Kendo MVVM binding    
    kendo.bind('body', viewModel);

})()

.action{
    display: inline-block;
    float: left;
    margin: 0 5px;
    cursor: pointer;
    width: 20px;
	height: 20px; 
}

.circle {
	border-radius: 50%;
    background-color: green;
    
}

.square {
    background-color: red;
}

#log {
    background-color: #eee;
    margin: 20px 0;
}



var toCSV = function (gridId, ignoredTemplates) {
    var csv = '';

    // Get access to basic grid data
    var grid = $("#" + gridId).data("kendoGrid"),
        datasource = grid.dataSource,
        originalPageSize = datasource.pageSize();

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

    //add the header row
    for (var i = 0; i < grid.columns.length; i++) {
        var title = grid.columns[i].title,
            field = grid.columns[i].field;
        if (typeof (field) === "undefined") { continue; /* no data! */ }
        if (typeof (title) === "undefined") { title = field }

        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) {
        for (var i = 0; i < grid.columns.length; i++) {
            var fieldName = grid.columns[i].field,
				template = grid.columns[i].template;

            if (typeof (fieldName) === "undefined") { continue; }
			
            var value = data[row][fieldName];

            if (value === null) {
                value = "";
            } else {
				if ((typeof(template) !== "undefined") && ($.inArray(fieldName.toString(), ignoredTemplates) < 0)) {
					value = value.toString();
					var kt = kendo.template(template.toString());
					value = kt(data[row]);
				} else {
					value = value.toString();
				}
            }

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

    // Reset datasource
    datasource.pageSize(originalPageSize);

    return csv;
};