Skip to Content

Hi all!,

This is an example to create a link to download a sap.ui.table.Table to CSV at client side (JS, supported by HTML5 browsers).

The next JS code, extracts header and content from table column&binding definition to generate a CSV B64 string. The download link uses ‘download’ HTML5 attr and Data Uri scheme (Data URI scheme – Wikipedia, the free encyclopedia) to export a filename at client side.

table_and_link.PNG

file_csv.PNG

Html:

<!DOCTYPE HTML>

<html>

  <head>

  <meta http-equiv=”X-UA-Compatible” content=”IE=edge”>

  <script src=”resources/sap-ui-core.js”

  id=”sap-ui-bootstrap”

  data-sap-ui-libs=”sap.ui.commons,sap.ui.table”

  data-sap-ui-theme=”sap_goldreflection”>

  </script>

  <!– add sap.ui.table,sap.ui.ux3 and/or other libraries to ‘data-sap-ui-libs’ if required –>

  <script src=”util/Base64.js”></script>

  <script>

  //Default view PortalUserView

  sap.ui.localResources(“view”);

  var view = sap.ui.view({id:”ExampleView”, viewName:”view.ExampleView”, type:sap.ui.core.mvc.ViewType.JS});

  view.placeAt(“content”);

  </script>

  </head>

  <body class=”sapUiBody” role=”application”>

  <div id=”content”></div>

  </body>

</html>

View:

sap.ui.jsview(“view.ExampleView”, {

  /** Specifies the Controller belonging to this View.

  * In the case that it is not implemented, or that “null” is returned, this View does not have a Controller.

  * @memberOf view.ExampleView

  */

  getControllerName : function() {

  return “view.ExampleView”;

  },

  /** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed.

  * Since the Controller is given to this method, its event handlers can be attached right away.

  * @memberOf view.ExampleView

  */

  createContent : function(oController) {

  //Define some sample data

  var aData = [

  {lastName: “Dente”, name: “Al”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“, gender: “male”, rating: 4},

  {lastName: “Friese”, name: “Andy”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“, gender: “male”, rating: 2},

  {lastName: “Mann”, name: “Anita”, checked: false, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “female”, rating: 3},

  {lastName: “Schutt”, name: “Doris”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “female”, rating: 4},

  {lastName: “Open”, name: “Doris”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “female”, rating: 2},

  {lastName: “Dewit”, name: “Kenya”, checked: false, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “female”, rating: 3},

  {lastName: “Zar”, name: “Lou”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 1},

  {lastName: “Burr”, name: “Tim”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“, gender: “male”, rating: 2},

  {lastName: “Hughes”, name: “Tish”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 5},

  {lastName: “Lester”, name: “Mo”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 3},

  {lastName: “Case”, name: “Justin”, checked: false, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 3},

  {lastName: “Time”, name: “Justin”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 4},

  {lastName: “Barr”, name: “Gaye”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 2},

  {lastName: “Poole”, name: “Gene”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“, gender: “male”, rating: 1},

  {lastName: “Ander”, name: “Corey”, checked: false, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 5},

  {lastName: “Early”, name: “Brighton”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 3},

  {lastName: “Noring”, name: “Constance”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “female”, rating: 4},

  {lastName: “Haas”, name: “Jack”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “male”, rating: 2},

  {lastName: “Tress”, name: “Matt”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“, gender: “male”, rating: 4},

  {lastName: “Turner”, name: “Paige”, checked: true, linkText: “www.sap.com”, href: “http://www.sap.com“,  gender: “female”, rating: 3}

  ];

  var oTable = createTable(aData);

  var csvText = generateTableCSV(oTable, aData);

  var oLink  = createDownloadLink(csvText);

  var layout = new sap.ui.commons.layout.VerticalLayout(“layout”, {

         content: [oLink, oTable]

  });

  return layout;

  }

});

/**

* Example table creation.

* See https://sapui5.netweaver.ondemand.com/sdk/#test-resources/sap/ui/table/demokit/Table.html#__2

* @param aData Table json data

*/

function createTable(aData) {

  //Create an instance of the table control

  var oTable = new sap.ui.table.Table({

  title: “Table Example”,

  visibleRowCount: 7,

  firstVisibleRow: 3,

  selectionMode: sap.ui.table.SelectionMode.Single

  });

  //Define the columns and the control templates to be used

  var oColumn = new sap.ui.table.Column({

  label: new sap.ui.commons.Label({text: “lastName”}),

  template: new sap.ui.commons.TextView().bindProperty(“text”, “lastName”),

  sortProperty: “lastName”,

  filterProperty: “lastName”,

  width: “200px”

  });

  var oCustomMenu = new sap.ui.commons.Menu();

  oCustomMenu.addItem(new sap.ui.commons.MenuItem({

  text:”Custom Menu”,

  select:function() {

  alert(“Custom Menu”);

  }

  }));

  oColumn.setMenu(oCustomMenu);

  oTable.addColumn(oColumn);

  oTable.addColumn(new sap.ui.table.Column({

  label: new sap.ui.commons.Label({text: “firstName”}),

  template: new sap.ui.commons.TextField().bindProperty(“value”, “name”),

  sortProperty: “name”,

  filterProperty: “name”,

  width: “100px”

  }));

  oTable.addColumn(new sap.ui.table.Column({

  label: new sap.ui.commons.Label({text: “checked”}),

  template: new sap.ui.commons.CheckBox().bindProperty(“checked”, “checked”),

  sortProperty: “checked”,

  filterProperty: “checked”,

  width: “75px”,

  hAlign: “Center”

  }));

  oTable.addColumn(new sap.ui.table.Column({

  label: new sap.ui.commons.Label({text: “website”}),

  template: new sap.ui.commons.Link().bindProperty(“text”, “linkText”).bindProperty(“href”, “href”),

  sortProperty: “linkText”,

  filterProperty: “linkText”

  }));

  oTable.addColumn(new sap.ui.table.Column({

  label: new sap.ui.commons.Label({text: “gender”}),

  template: new sap.ui.commons.ComboBox({items: [

  new sap.ui.core.ListItem({text: “female”}),

  new sap.ui.core.ListItem({text: “male”})

  ]}).bindProperty(“value”,”gender”),

  sortProperty: “gender”,

  filterProperty: “gender”

  }));

  oTable.addColumn(new sap.ui.table.Column({

  label: new sap.ui.commons.Label({text: “rating”}),

  template: new sap.ui.commons.RatingIndicator().bindProperty(“value”, “rating”),

  sortProperty: “rating”,

  filterProperty: “rating”

  }));

  //Create a model and bind the table rows to this model

  var oModel = new sap.ui.model.json.JSONModel();

  oModel.setData({modelData: aData});

  oTable.setModel(oModel);

  oTable.bindRows(“/modelData”);

  //Initially sort the table

  oTable.sort(oTable.getColumns()[0]);

  //Bring the table onto the UI

  return oTable;

}

/**

* Export table header and data into a CSV string.

*/

function generateTableCSV(table, jsonData) {

  var info = ”;

  for (var i =0; i<table.getColumns().length; i++) {

  info+= encodeURIComponent(table.getColumns()[i].getLabel().getText()) + ‘;’;

  }

  info += ‘\r\n’;

  if (jsonData.length != undefined) {

  for (var j=0; j<jsonData.length; j++) {

  for (var i =0; i<table.getColumns().length; i++) {

  if (table.getColumns()[i].getTemplate() != undefined && table.getColumns()[i].getTemplate().getBinding(‘text’) != undefined) {

  var valor = eval(‘jsonData[j].’+table.getColumns()[i].getTemplate().getBinding(‘text’).sPath);

  info+= encodeURIComponent(valor) + ‘;’;

  } else if (table.getColumns()[i].getTemplate() != undefined && table.getColumns()[i].getTemplate().getBinding(‘value’) != undefined) {

  var valor = eval(‘jsonData[j].’+table.getColumns()[i].getTemplate().getBinding(‘value’).sPath);

  info+= encodeURIComponent(valor) + ‘;’;

  } else

  info+= ‘;’;

  }

  info += ‘\r\n’;

  }

  } else {

  $.each(jsonData, function(key,value){

  for (var i =0; i<table.getColumns().length; i++) {

  if (table.getColumns()[i].getTemplate() != undefined && table.getColumns()[i].getTemplate().getBinding(‘text’) != undefined) {

  var valor = eval(‘jsonData[j].’+table.getColumns()[i].getTemplate().getBinding(‘text’).sPath);

  info+= encodeURIComponent(valor) + ‘;’;

  } else if (table.getColumns()[i].getTemplate() != undefined && table.getColumns()[i].getTemplate().getBinding(‘value’) != undefined) {

  var valor = eval(‘jsonData[j].’+table.getColumns()[i].getTemplate().getBinding(‘value’).sPath);

  info+= encodeURIComponent(valor) + ‘;’;

  } else

  info+= ‘;’;

  }

  info += ‘\r\n’;

  });

  }

  return info;

}

/**

* Creates a link target to base64 data

*/

function createDownloadLink(b64text) {

  var oLink = new sap.ui.commons.Link(“linkExportCsv”, {

  text: ‘Download as CSV’,

  href: ‘data:application/csv;charset=utf-8;base64,’ + (Base64.encode(b64text))

  });

  initDownloadAttr(‘FileName-Example.csv’)

  return oLink;

}

/**

* Creates download attribute to set filename

*/

function initDownloadAttr() {

  if ($( “#linkExportCsv” ).length > 0) {

  $( “#linkExportCsv” ).attr(‘download’, ‘filename.csv’);

  } else {

  setTimeout(initDownloadAttr, 1000);

  }

}


Base 64 util:


/**

*

*  Base64 encode / decode

http://www.webtoolkit.info/

*

**/

var Base64 = {

  // private property

  _keyStr : “ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=”,

  // public method for encoding

  encode : function (input) {

  var output = “”;

  var chr1, chr2, chr3, enc1, enc2, enc3, enc4;

  var i = 0;

  input = Base64._utf8_encode(input);

  while (i < input.length) {

  chr1 = input.charCodeAt(i++);

  chr2 = input.charCodeAt(i++);

  chr3 = input.charCodeAt(i++);

  enc1 = chr1 >> 2;

  enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);

  enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);

  enc4 = chr3 & 63;

  if (isNaN(chr2)) {

  enc3 = enc4 = 64;

  } else if (isNaN(chr3)) {

  enc4 = 64;

  }

  output = output +

  this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +

  this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);

  }

  return output;

  },

  // public method for decoding

  decode : function (input) {

  var output = “”;

  var chr1, chr2, chr3;

  var enc1, enc2, enc3, enc4;

  var i = 0;

  input = input.replace(/[^A-Za-z0-9\+\/\=]/g, “”);

  while (i < input.length) {

  enc1 = this._keyStr.indexOf(input.charAt(i++));

  enc2 = this._keyStr.indexOf(input.charAt(i++));

  enc3 = this._keyStr.indexOf(input.charAt(i++));

  enc4 = this._keyStr.indexOf(input.charAt(i++));

  chr1 = (enc1 << 2) | (enc2 >> 4);

  chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);

  chr3 = ((enc3 & 3) << 6) | enc4;

  output = output + String.fromCharCode(chr1);

  if (enc3 != 64) {

  output = output + String.fromCharCode(chr2);

  }

  if (enc4 != 64) {

  output = output + String.fromCharCode(chr3);

  }

  }

  output = Base64._utf8_decode(output);

  return output;

  },

  // private method for UTF-8 encoding

  _utf8_encode : function (string) {

  string = string.replace(/\r\n/g,”\n”);

  var utftext = “”;

  for (var n = 0; n < string.length; n++) {

  var c = string.charCodeAt(n);

  if (c < 128) {

  utftext += String.fromCharCode(c);

  }

  else if((c > 127) && (c < 2048)) {

  utftext += String.fromCharCode((c >> 6) | 192);

  utftext += String.fromCharCode((c & 63) | 128);

  }

  else {

  utftext += String.fromCharCode((c >> 12) | 224);

  utftext += String.fromCharCode(((c >> 6) & 63) | 128);

  utftext += String.fromCharCode((c & 63) | 128);

  }

  }

  return utftext;

  },

  // private method for UTF-8 decoding

  _utf8_decode : function (utftext) {

  var string = “”;

  var i = 0;

  var c = c1 = c2 = 0;

  while ( i < utftext.length ) {

  c = utftext.charCodeAt(i);

  if (c < 128) {

  string += String.fromCharCode(c);

  i++;

  }

  else if((c > 191) && (c < 224)) {

  c2 = utftext.charCodeAt(i+1);

  string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));

  i += 2;

  }

  else {

  c2 = utftext.charCodeAt(i+1);

  c3 = utftext.charCodeAt(i+2);

  string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));

  i += 3;

  }

  }

  return string;

  }

}

To report this post you need to login first.

52 Comments

You must be Logged on to comment or reply to a post.

  1. Kannan Kumar

    Thanks for the great post.It was really helpful. 🙂

    Does the current code download the data from the JSON Model(i.e. initial data bound to the the Table)?

    I was wondering is there a way to download changed/new data from the Table after the changes are made to the Table by user.

    Cheers,

    Kannan

    (0) 
  2. pandu j

    Hi Angel,

    can you please explain the purpose of the below code ?

    if{}

    else

    $.each(jsonData, function(key,value){

    for(var I=0; I< table.getColumns().length; I++)

    if(table.getColumns()[I].getTemplate()!= undefined && table.getColumns()[I].getTemplate().getBindin(‘text’) != undefined){

    ——————–

    ——————

    }

    I didn’t understand in which scenario the above code in the else condtion gets executed.

    and also can you please explain href:’data:application/CSV;charset=utf-8;base64,’+(Base64.encode(b64text));

    here we are encoding it to base64 format don’t we need to decode it ?

    or the browser has the capability to decode it ?

    Many Thanks,

    Pandu.

    (0) 
    1. Angel Puertas Post author

      Hi Pandu!

      If you don’t bind your SAPUI component property ‘text’ to model this sentence will produce undefined. For example:

      //Define the columns and the control templates to be used

      var oColumn = new sap.ui.table.Column({

      label: new sap.ui.commons.Label({text: “Fixed value column”}),

      template: new sap.ui.commons.TextView({text: ‘Fixed value’}),

      width: “200px”

      });

      This sentence, is a standard URI convention (RFC 2397 – The &quot;data&quot; URL scheme). Any compatible browser will decode the value to open  :

      data:application/CSV;charset=utf-8;base64,’+(Base64.encode(b64text));


      Kind regards!


      (0) 
      1. pandu j

        Thanks For the quick Reply Angel –

        I am sort to say , I still didn’t Understand Why $.each(jsonData, Function(Key,Value){

        _______

        _______

        }

        this Method has been called . what is the Purpose  function(Key, Value ) ?

        Many Thanks ,

        Pandu.

        (0) 
        1. Angel Puertas Post author

          Ah ok, I didn’t understand you too.


          $.each(jsonData, Function(Key,Value){

          It’s a way of looping json data. For each json element function is called, then Key is the name of the attr and value is the value of corresponding attr.


          Kind regards

          (0) 
          1. pandu j

            Angel

            In the IF part of the code ,as you Explained we have done binding between sap ui Component “text” to  model . I am clear about that.

            If there is some data in jsonData, jsonData.length will not be equal to Undefined. My Understanding is that when we have some data in the JsonData It will not come to else Part. Is  there any scenario where it will come to else part ?

            Many Thanks,

            pandu.

            (0) 
            1. Angel Puertas Post author

              Hi again Pandu,


              I think this sentence could produce undefined if data binding is not done in column. But jsonData doesn’t take part in this sentence.


              if(table.getColumns()[I].getTemplate()!= undefined && table.getColumns()[I].getTemplate().getBindin(‘text’) != undefined){

              I’m not sure if we are talking about the same problem.

              Kind regards!

              (0) 
    1. Angel Puertas Post author

      Hi Sridevi,

      To format a XSL file, you must generate this file in server side (ABAP or JAVA, depending on your architecture). 

      Java: You must create a service (for example a servlet) and use an XLS generator like Apache Poi to format this Excel (if you are deploying on a Java WAS).

      ABAP: I’m not an ABAP expert but I think you could generate an ITS service to generate XLS file throught an ABAP function.

      Kind regards

      (0) 
    1. Angel Puertas Post author

      Hi Alexander,

      Could you post a JSBin with your code? I’ve tested succesfully on >=IE9. IE8 doesn’t interpret data uri scheme.

      Kind regards

      (0) 
      1. Alexander Thiel

        Hi Angel,

        not my code but it’s the same problem there:

        Edit fiddle – JSFiddle

        Clicking “Download CSV” one new IE window appears with “data:text/csv;charset=utf-8,%22Id%22%2C%22UserName%22%0D%0A%221%22%2C%22Sam%20Smith%22%0D%0A%222%22%2C%22Fred%20Frankly%22%0D%0A%221%22%2C%22Zachary%20Zupers%22%0D%0A” in the url field. No download window – no csv …

        With Firefox, all works fine. I use IE 9.0.23. – which IE9 do you use?

        (0) 
          1. Alexander Thiel

            Hi Angel,

            thanks for your help.

            Please note, I’m a newbie regarding javascript developing. What do you you mean in detail with:

            …you must set download attribute to link in order to dowload a file with complete filename.

            Maybe you’ve got an example for me!?!

            Thanks and regards,

            Alex

            (0) 
            1. Angel Puertas Post author

              Hi again Alexander!

              Your example download a file without name. You need to set download attribute to your link in order to get a file with name e.g: download.csv

              <a href=”data:….” download=”filename.csv”>Download</a>

              In the example I’ve blogged you could see this on function:

              /**

              * Creates a link target to base64 data

              */

              function createDownloadLink(b64text) {

                var oLink = new sap.ui.commons.Link(“linkExportCsv”, {

                text: ‘Download as CSV’,

                href: ‘data:application/csv;charset=utf-8;base64,’ + (Base64.encode(b64text))

                });

                initDownloadAttr(‘FileName-Example.csv’)

                return oLink;

              }


              Kind regards

              (0) 
              1. Alexander Thiel

                Hi Angel,

                I do not know, what’s wrong: I copied your code in one new project and deployed it. All works fine: I see the table with dummy data, I’m able to download the table with firefox, but if I call the table with the help of my IE9 and click the download link – nothing happens: I just get one empy side with “about:blank” in the url field. 😐

                Some colleagus have the same problems with IE9 too.

                (0) 
                1. Mohit Sachdeva

                  Hi were you able to fix the issue ?? I am facing the same issue so I was wondering if you have done it , then you can help me with the same.

                  (0) 
  3. Georgie Nushev

    Hi Angel,

    thanks for the blog! really great work!

    I copied the code, but unfortunately my code downloads the file without name.

    In the function initDownloadAttr() my ($( “#linkExportCsv” ).length is always 0; Any ideas how i could fix that?


    Regards,

    Georgi

    (0) 
      1. Georgie Nushev

        Hi Jacob,

        Thanks for your replay!

        I tested in FF but i still get the length 0.

        Is there any workaround or another way to set the file format to csv?

        Regards

        Georgi

        (0) 
  4. Mohit Sachdeva

    It does not work in IE 10 . I saw the above comments but they were not of much help.

    Please help me regarding the same. Your help would be appreciated.

    (0) 
  5. Michael Estwanick

    I’m having some trouble setting the filename, Once I click the link the file is downloaded under the name “download” and of no type. Once I change the file extension to .csv everything works fine. Is there anyway I could modify this could to do that automatically? Thanks.

    (0) 
    1. Michael Estwanick

      Have you had any success implementing this example in your own code? I am using a JS view cannot get this to work in my code. The error goes away once I remove the include statements but then nothing works after

      jQuery.sap.require("sap.ui.core.util.Export");
      jQuery.sap.require("sap.ui.core.util.ExportTypeCSV");
      jQuery.sap.require("sap.m.TablePersoController");
      jQuery.sap.require("sap.m.sample.TableExport.DemoPersoService");
      jQuery.sap.require("sap.m.sample.TableExport.Formatter");

      (0) 
      1. Sachin Singh Gusain

        Hi Michael,

        Remove the last two require from your code and it will work.

        just use the below code.

        jQuery.sap.require(“sap.ui.core.util.Export”);

        jQuery.sap.require(“sap.ui.core.util.ExportTypeCSV”);

        jQuery.sap.require(“sap.m.TablePersoController”);

        no need of

        jQuery.sap.require(“sap.m.sample.TableExport.DemoPersoService”);

        jQuery.sap.require(“sap.m.sample.TableExport.Formatter”);

        (0) 
    2. Feng Sihao

      but it seems only for the sap.m library,

      if I want to use this way for sap.ui.table, it doesn’t work.

      the error like this :



      GET http://127.0.0.1:3000/openui5/resources/sap/ui/core/util/Export/library-preload.json 404 (Not Found) sap-ui-core.js:27send sap-ui-core.js:27Q.extend.ajax sap-ui-core.js:27jQuery.sap.preloadModules sap-ui-core.js:80(anonymous function) sap-ui-core.js:134Q.extend.each sap-ui-core.js:16E.extend.constructor sap-ui-core.js:134(anonymous function) sap-ui-core.js:134(anonymous function) sap-ui-core.js:134(anonymous function) sap-ui-core.js:80Z sap-ui-core.js:80sap.ui.define sap-ui-core.js:80(anonymous function) sap-ui-core.js:134

      2014-10-20 12:50:19 failed to preload ‘sap.ui.core.util.Export.library-preload’: Not Found –  sap.ui.ModuleSystem sap-ui-core.js:80

      GET http://127.0.0.1:3000/openui5/resources/sap/ui/core/util/ExportTypeCSV/library-preload.json 404 (Not Found) sap-ui-core.js:27

      2014-10-20 12:50:19 failed to preload ‘sap.ui.core.util.ExportTypeCSV.library-preload’: Not Found –  sap.ui.ModuleSystem sap-ui-core.js:80

      GET http://127.0.0.1:3000/openui5/resources/sap/ui/core/util/Export/library.js 404 (Not Found) sap-ui-core.js:27

      Uncaught Error: failed to load ‘sap/ui/core/util/Export/library.js’ from /openui5/resources/sap/ui/core/util/Export/library.js: 404 – Not Found sap-ui-core.js:80

      Uncaught Error: Core must be initialized sap-ui-core.js:134

      Is there ExportTypeCSV  function for sap.ui.table?

      (0) 
      1. Feng Sihao

        I see, these two libs is required:

        jQuery.sap.require(“sap.ui.core.util.Export”);

        jQuery.sap.require(“sap.ui.core.util.ExportTypeCSV”);

        (0) 
  6. Martin Fu

    great post!

    the initDownloadAttr attribute function didn’t work for me though.

    instead i use this to modify the link attribute after DOM is ready.

    ———————————————————————

    function setDownloadFileName(id, filename){

      function waitForLinkReady(cb) {

      var callback = cb;

      function wait() {

      if ($(id).attr(‘id’))

      callback();

      else

      window.setTimeout(wait, 100)

      }

      wait();

      }

      waitForLinkReady(function() {

      $(id).attr(‘download’,filename)

      });

    }

    (0) 
  7. Vibhor Bhatnagar

    Hi, I am sorry if i am asking a silly question, but i am a beginner and would like to ask where is the code under “Base 64 util”placed. It is a seperate js file under webcontent/view or is it placed somewhere else.

    Thanks and Regards

    (0) 
        1. Sachin Singh Gusain

          It will be downloaded in this format only.
          if you want you can go to the data tab in the excel and use text to data option to see the data in column format.
          Untitled.png

          Hope it helps.

          (0) 
  8. Mahesh Z

    Hi All,

    I tried the same example however its not displaying the table data, instead its displaying ,,,,,,, for me for all table data, headers are coming fine.

    Can anyone please let me know what is the issue here ?

    Error.jpg

    (0) 
      1. Mahesh Z

        Hi Pandu ,

        Thanks for your reply, There is no error on console however , following lines are returning values as Undefined hence its not going inside.

        table.getColumns()[i].getTemplate().getBinding(‘text’)

        table.getColumns()[i].getTemplate().getBinding(‘value’)

        Its inside the if condition.

        Thanks & Regards,

        Mahesh Zeple.

        (0) 
          1. Michael Appleby

            Mahesh Z and Rosemol Francis,

            Your Comment to a Document will not receive the same scrutiny from knowledgeable experts as a Discussion marked as a Question.  Many of those experts ignore comments on Documents.  See the Getting Started link at the top right to see the differences between Blogs, Discussions, and Documents and when each should be used.  If your question relates to a specific blog or document, put in a link to it.  With the creation of a Discussion, you will also be able to reward the Helpful and Correct Answers with points. You can also turn on notifications so that whenever someone posts to your Discussion, you will get an email of the update and its contents.

            .

            NOTE: Getting the link is easy enough for both the author and document.  Simply MouseOver the item, Right Click, and select Copy Shortcut.  Paste it into your Discussion.  You can also click on the url after pasting.  Click on the A to expand the options and select T (on the right) to Auto-Title the url.

            Cheers, Mike (Moderator)

            (0) 
  9. Jayanchanthres Murugesan

    Hi All,

       I have tried same code as mentioned above but I am getting excel like this.

    Screenshot_1.png

    I can only get the table header.Can any one help me how to fix this issue?

    Thanks

    JayanChanthres

    (0) 

Leave a Reply