locked
Export to excel in Angular js and ASP.Net Web Api RRS feed

  • Question

  • User1284890338 posted

    Hi all,

    I am using angular js for UI and ASP.Net Web Api. I have a grid with page size as 20 and export to excel button which will export all the data (more than 10 k records) in a single go to excel.

    what approach will be the best for export to excel functionality? Does angular gives me something out of the box functionality for export to excel?

    Monday, February 22, 2016 4:59 AM

Answers

  • User61956409 posted

    Hi Harry,

    Even if only 20 records are being shown on the UI, i should be able to export all matching records from the database as well. Hope i am clear this time.

    You could try to send AJAX request to web method to get all matching records from database, then you could dynamically generate html for table (need to be exported) based on returned records in AJAX  success callback function.

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, February 24, 2016 8:48 AM
  • User541108374 posted

    Hi,

    Even if only 20 records are being shown on the UI, i should be able to export all matching records from the database as well. Hope i am clear this time.

    That's a completely different question and hence needs a different answer. In such a case you can make a separate endpoint in your application (webservice, web api, MVC, HttpHandler, webform) that would capture the parameters needed to fetch the data (if needed) and emits as result an excel or csv file with the correct mime type so excel gets opened on the client (provided it's installed there). There are a bunch of articles and tutorials to be found via google / bing on how to do so.

    Grz, Kris.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, February 24, 2016 9:31 AM

All replies

  • User541108374 posted

    Hi,

    what approach will be the best for export to excel functionality? Does angular gives me something out of the box functionality for export to excel?

    You can make use of filesaver.js. A quick google search for angular export to excel gave me a bunch of hits and one of the first answers gave me this jsfiddle (takes a while to load in on my pc): http://jsfiddle.net/4v02qpxd/. Click the checkbox(es) on each line and the export button will appear.

    Grz, Kris.

    Monday, February 22, 2016 7:18 AM
  • User61956409 posted

    Hi Harry,

    You could use ngClick directive to specify custom behavior (export data to excel) when Export button is clicked. The following links will be helpful.

    https://medium.com/@darilldrems/angularjs-export-html-table-to-pdf-excel-or-doc-formats-bb741d06dfec#.pgeh6eh7w

    http://jsfiddle.net/TheSharpieOne/XNVj3/1/

    Best Regards,

    Fei Han

    Tuesday, February 23, 2016 5:28 AM
  • User1284890338 posted

    Folks, i am sorry if i was not able to clear myself. But both above solutions export the data which is currently displayed in the UI in table. I need to export all the data which satisfies filter criteria, no matter if pagination is applied on UI.

    Even if only 20 records are being shown on the UI, i should be able to export all matching records from the database as well. Hope i am clear this time.

    Tuesday, February 23, 2016 6:27 PM
  • User61956409 posted

    Hi Harry,

    Even if only 20 records are being shown on the UI, i should be able to export all matching records from the database as well. Hope i am clear this time.

    You could try to send AJAX request to web method to get all matching records from database, then you could dynamically generate html for table (need to be exported) based on returned records in AJAX  success callback function.

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, February 24, 2016 8:48 AM
  • User541108374 posted

    Hi,

    Even if only 20 records are being shown on the UI, i should be able to export all matching records from the database as well. Hope i am clear this time.

    That's a completely different question and hence needs a different answer. In such a case you can make a separate endpoint in your application (webservice, web api, MVC, HttpHandler, webform) that would capture the parameters needed to fetch the data (if needed) and emits as result an excel or csv file with the correct mime type so excel gets opened on the client (provided it's installed there). There are a bunch of articles and tutorials to be found via google / bing on how to do so.

    Grz, Kris.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, February 24, 2016 9:31 AM