IE issue

[2Codedd]

Hello,

The export button does not work in IE 11 or older versions of IE, any ideas?

Thanks

[rathiingit]

I got same I.E issue in my application using laravel anguarl js. Kindly resolve this.

Thanks.

[Doctor06]

Same here. Export on ie11 does not work. Console throws warning: 'The code on this page disabled back and forward caching'.
The demo doesn't work either on ie11

[alessandro-dallatorre]

I developed a workaround using Blob for IE10/IE11. Code follows:

(function (angular) {

  // Create all modules and define dependencies to make sure they exist
  // and are loaded in the correct order to satisfy dependency injection
  // before all nested files are concatenated by Gulp

  // Config
  angular.module('ngTableToCsv.config', [])
    .config(['$compileProvider', function ($compileProvider) {
      // allow data links
      $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|data):/);
    }])
    .value('ngTableToCsv.config', {
      debug : true
    });

  // Modules
  angular.module('ngTableToCsv.directives', []);
  angular.module('ngTableToCsv',
    [
      'ngTableToCsv.config',
      'ngTableToCsv.directives'
    ]);

})(angular);

(function (angular) {
  'use strict';

  angular.module('ngTableToCsv.directives')
    .directive('exportCsv', ['$parse',
      function ($parse) {
        return {
          restrict : 'A',
          scope    : false,
          link     : function (scope, element, attrs) {
            var data = '';
            var separator = attrs.separator ? attrs.separator : ',';
            var ignoreSelector = attrs.exportCsvIgnore || '.ng-table-filters';
            var csv = {
              stringify : function (str) {
                return '"' +
                  str.replace(/^\s\s*/, '').replace(/\s*\s$/, '') // trim spaces
                    .replace(/"/g, '""') + // replace quotes with double quotes
                  '"';
              },
              generate  : function () {
                data = '';
                var rows = element.find('tr');
                angular.forEach(rows, function (row, i) {
                  var tr = angular.element(row),
                    tds = tr.find('th'),
                    rowData = '';
                  if (tr.hasClass(ignoreSelector)) {
                    return;
                  }
                  if (tds.length === 0) {
                    tds = tr.find('td');
                  }
                  angular.forEach(tds, function (td, i) {
                    var value;
                    td = angular.element(td);
                    if (!td.hasClass(ignoreSelector)) {
                      value = angular.element(td).text();
                      rowData += csv.stringify(value) + separator;
                    }
                  });
                  rowData = rowData.slice(0, rowData.length - 1); //remove last separator
                  data += rowData + '\n';
                });
                // if browser is IE then save the file as blob
                var browser = window.navigator.appVersion;
                if ((browser.indexOf('Trident') !== -1 && browser.indexOf('rv:11') !== -1) ||
                (browser.indexOf('MSIE 10') !== -1)) {
                    var blobObject = new Blob([data]);     
                    window.navigator.msSaveBlob(blobObject, 'export.csv'); 
                } 
              },
              link      : function () {                
                 // if browser is IE then save the file as blob
                var browser = window.navigator.appVersion;
                if ((browser.indexOf('Trident') !== -1 && browser.indexOf('rv:11') !== -1) ||
                (browser.indexOf('MSIE 10') !== -1)) 
                    return '';
                else 
                    return 'data:text/csv;charset=UTF-8,' + encodeURIComponent(data);
              }
            };
            $parse(attrs.exportCsv).assign(scope.$parent, csv);
          }
        };
      }
    ]);
})(angular);

[ale-nasso]

Hi,
I'm using alessandro-dallatorre's solution.
To avoid the export of the filters row, I removed the dot before the 'ng-table-filters' on the ignoreSelector var:

var ignoreSelector = attrs.exportCsvIgnore || 'ng-table-filters';

[ale-nasso]

I made another little change to the alessandro-dallatorre's solution to use the filter row and the export-csv-ignore in the same table.
I have added the var filterRowClass and I check if the row has this class.

(function (angular) {

// Create all modules and define dependencies to make sure they exist
// and are loaded in the correct order to satisfy dependency injection
// before all nested files are concatenated by Gulp

// Config
angular.module('ngTableToCsv.config', [])
.config(['$compileProvider', function ($compileProvider) {
// allow data links
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|data):/);
}])
.value('ngTableToCsv.config', {
debug : true
});

// Modules
angular.module('ngTableToCsv.directives', []);
angular.module('ngTableToCsv',
[
'ngTableToCsv.config',
'ngTableToCsv.directives'
]);

})(angular);

(function (angular) {
'use strict';

angular.module('ngTableToCsv.directives')
.directive('exportCsv', ['$parse',
function ($parse) {
return {
restrict : 'A',
scope : false,
link : function (scope, element, attrs) {
var data = '';
var separator = attrs.separator ? attrs.separator : ',';
var ignoreSelector = attrs.exportCsvIgnore;
var filterRowClass = 'ng-table-filters';
var csv = {
stringify : function (str) {
return '"' +
str.replace(/^\s\s*/, '').replace(/\s*\s$/, '') // trim spaces
.replace(/"/g, '""') + // replace quotes with double quotes
'"';
},
generate : function () {
data = '';
var rows = element.find('tr');
angular.forEach(rows, function (row, i) {
var tr = angular.element(row),
tds = tr.find('th'),
rowData = '';
if (tr.hasClass(ignoreSelector) || tr.hasClass(filterRowClass)) {
return;
}
if (tds.length === 0) {
tds = tr.find('td');
}
angular.forEach(tds, function (td, i) {
var value;
td = angular.element(td);
if (!td.hasClass(ignoreSelector)) {
value = angular.element(td).text();
rowData += csv.stringify(value) + separator;
}
});
rowData = rowData.slice(0, rowData.length - 1); //remove last separator
data += rowData + '\n';
});
// if browser is IE then save the file as blob
var browser = window.navigator.appVersion;
if ((browser.indexOf('Trident') !== -1 && browser.indexOf('rv:11') !== -1) ||
(browser.indexOf('MSIE 10') !== -1)) {
var blobObject = new Blob([data]);
window.navigator.msSaveBlob(blobObject, 'export.csv');
}
},
link : function () {
// if browser is IE then save the file as blob
var browser = window.navigator.appVersion;
if ((browser.indexOf('Trident') !== -1 && browser.indexOf('rv:11') !== -1) ||
(browser.indexOf('MSIE 10') !== -1))
return '';
else
return 'data:text/csv;charset=UTF-8,' + encodeURIComponent(data);
}
};
$parse(attrs.exportCsv).assign(scope.$parent, csv);
}
};
}
]);
})(angular);