NEW VERSION RELEASED! Webix 11 Read More Core Updates, Extended Functionalities in SpreadSheet and File Manager and more

Export to Excel, PDF, CSV, and PNG formats , JavaScript Programming Example of Export to Excel, PDF, CSV, and PNG formats in SpreadSheet

JavaScript Programming Example of Export to Excel, PDF, CSV, and PNG formats in SpreadSheet

With the programming example below you can export SpreadSheet data to Excel, PDF, CSV, and PNG formats. Note that the piece of code is free. Don't hesitate to use the coding samples by Webix for your web development projects.

JS Code

webix.ready(function(){
  var buttons = {
    padding:10, 
    margin:5,
    width:150, 
    rows:[
      { view:"button", value:"Export to Excel", click: function(){
        webix.toExcel("ss1");
      }},
      { view:"button", value:"Export to PNG", click:function(){
        webix.toPNG("ss1");
      }},
      { view:"button", value:"Export to PDF", click:function(){
        webix.toPDF("ss1", {autowidth:true});
      }},
      { view:"button", value:"Export to CSV", click:function(){
        webix.toCSV("ss1");
      }},
      {}
    ]
  };

  webix.ui({
    cols:[ buttons, {
      id:"ss1",
      view:"spreadsheet",
      toolbar: "full",
      data: sheet1_data

    }]
  });
});

HTML Code

<script>
 var sheet1_data = {"data":[["1","1","","wss8"],["1","2","","wss6"],["1","3","Sales","wss7"],["1","4","","wss6"],["1","5","Prediction","wss4"],["2","1","Department","wss1"],["2","2","2013","wss3"],["2","3","2014","wss3"],["2","4","2015","wss3"],["2","5","2016","wss3"],["3","1","Sport gears",""],["3","2","4550","wss5"],["3","3","4780","wss5"],["3","4","4920","wss5"],["3","5","5904","wss5"],["4","1","Gadgets",""],["4","2","2245","wss5"],["4","3","4483","wss5"],["4","4","7460","wss5"],["4","5","8952","wss14"],["5","1","Beverage",""],["5","2","750","wss5"],["5","3","640","wss5"],["5","4","755","wss5"],["5","5","830.5","wss5"],["6","1","Total","wss11"],["6","2","=SUM(B3:B5)","wss12"],["6","3","=SUM(C3:C5)","wss12"],["6","4","=SUM(D3:D5)","wss12"],["6","5","=SUM(E3:E5)","wss12"]],"styles":[["wss1",";#CEFEFE;"],["wss2",";#CEE6FE;"],["wss3","#000000;#CEE6FE;center"],["wss4","#000000;#CEFEFE;center"],["wss5",";;center"],["wss6","#000000;#CEFEE6;left"],["wss7","#000000;#CEFEE6;center"],["wss8","#000000;#FFFFFF;left"],["wss9","#FFFFFF;;"],["wss10","#FFFFFF;#424242;"],["wss11","#FFFFFF;#424242;right"],["wss12","#FFFFFF;#424242;center"],["wss13","#000000;#ffffff;left"],["wss14","#000000;#ffffff;center"]],"sizes":[["0","1","169"]],"spans":[]};
</script>