Export to Excel a Table Record and Print in Jquery

Web browser wars hurt developers’ hearts. It is mostly about CSS, sometimes about JavaScript, HTML etc…

Thus I know how it feels when you expect something to get done easily appears a lot more harder than you expected.

Code below is tested only with Chrome (24+). It is making these processes:

• Gets the HTML code of your table inside your div element.
• Replaces the spaces in the code with correct syntax for Excel (otherwise spaces will be removed in your Excel sheet).
• Generates a specific file name (for minutes) in order to avoid overriding old files and to supply archiving by date values.
• And lastly and most importantly, saving the file with a custom file name.

HTML Code :

<iframe id="txtArea1" style="display:none"></iframe>

<td> <input type="button" id="btnExporttoExcel" class="btnClass" title="Export To Excel" onclick="fnExcelReport()" name="Export To Excel" value="Export To Excel">  </td>

   </td>  <td><input id="idprint" value="Print"  class="btnClass"   onclick="return PrintDocument('responsiveGrid');"  type="button"/>  </td>

 

JS Code:

 

function fnExcelReport1()

{

        var dt = new Date();

        var day = dt.getDate();

        var month = dt.getMonth() + 1;

        var year = dt.getFullYear();

        var hour = dt.getHours();

        var mins = dt.getMinutes();

        var postfix = day + "." + month + "." + year + "_" + hour + "." + mins;

        //creating a temporary HTML link element (they support setting file names)

        var a = document.createElement('a');

        //getting data from our div that contains the HTML table

        var data_type = 'data:application/vnd.ms-excel';

        var table_div = document.getElementById('responsiveGrid');

        var table_html = table_div.outerHTML.replace(/ /g, '%20');

        a.href = data_type + ', ' + table_html;

        //setting the file name

        a.download = 'exported_table_' + postfix + '.xls';

        //triggering the function

        a.click();

        //just in case, prevent default behaviour

        e.preventDefault();

}

 

//or

function fnExcelReport()

    {

         var dt = new Date();

         var day = dt.getDate();

         var month = dt.getMonth() + 1;

         var year = dt.getFullYear();

         var hour = dt.getHours();

         var mins = dt.getMinutes();

         var postfix = day + "." + month + "." + year + "_" + hour + "." + mins;

         var tab_text="<table border='2px'><tr bgcolor='#D1D3D4'>";

         var textRange; var j=0;

                 tab = document.getElementById('tablepaging'); // id of table

         for(j = 0 ; j < tab.rows.length ; j++)

          {    

                tab_text=tab_text+tab.rows[j].innerHTML+"</tr>";

                //tab_text=tab_text+"</tr>";

          }

          tab_text=tab_text+"</table>";

          tab_text= tab_text.replace(/<A[^>]*>|<\/A>/g, "");//remove if u want links in your table

          tab_text= tab_text.replace(/<img[^>]*>/gi,""); // remove if u want images in your table

          tab_text= tab_text.replace(/<input[^>]*>|<\/input>/gi, ""); // reomves input params

          var ua = window.navigator.userAgent;

          var msie = ua.indexOf("MSIE ");

          if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer

             {

                   txtArea1.document.open("txt/html","replace");

                   txtArea1.document.write(tab_text);

                   txtArea1.document.close();

                   txtArea1.focus();

                   var NameofExcel='BEPS_Report_' + postfix + '.xlsx';

                   Ram=txtArea1.document.execCommand("SaveAs",true,NameofExcel);

             } 

          else                 //other browser not tested on IE 11

                     Ram= window.open('data:application/vnd.ms-excel,filename=filename.xlsx,' + encodeURIComponent(tab_text));

                    // Ram= window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));

                    return (Ram);

}       

 

function PrintDocument(divName) {

     alert('Ram');

     var printcontents = document.getElementById(divName).innerHTML;

     var originablecontents = document.body.innerHTML;

     document.body.innerHTML = printcontents;

     window.print();

     document.body.innerHTML = originablecontents;

}