Export Webgrid Data To Microsoft Excel In ASP.NET MVC 5

Raviteja Swayampu

12 Comments

Join the conversation! Your thoughts help the community grow.

Jorge Guateque7y ago
Hello from Colombia. Many thanks to you !!!
Miguel Díaz9y ago
Public void PrintExcel([Bind(Include = "vpn_tb_equipo,admon_loc_tb_equipo, familia_tb_equipo,rfc8_tb_equipo, pto_patch_tb_equipo, tipo_tb_equipo, serie_sw_tb_equipo, marca_tb_equipo, inventario_tb_equipo, area_ubicacion_tb_equipo, perfil_tb_equipo, modelo_tb_equipo, serie_tb_equipo, estatus_tb_equipo, proyecto_tb_equipo, pto_switch_tb_equipo, proyecto_tb_equipo, direccion_ip_tb_equipo, direccion_mac_tb_equipo, nombre_pc_tb_equipo")] tb_equipo tb_equipo) { int cont = 0; int total = 0; string query = ""; Dictionary<string, string> param = new Dictionary<string, string>() { {"vpn_tb_equipo", tb_equipo.vpn_tb_equipo}, {"admon_loc_tb_equipo", tb_equipo.admon_loc_tb_equipo}, {"rfc8_tb_equipo",tb_equipo.rfc8_tb_equipo}, {"tipo_tb_equipo",tb_equipo.tipo_tb_equipo}, {"marca_tb_equipo",tb_equipo.marca_tb_equipo}, {"modelo_tb_equipo",tb_equipo.modelo_tb_equipo}, {"familia_tb_equipo",tb_equipo.familia_tb_equipo}, {"area_ubicacion_tb_equipo",tb_equipo.area_ubicacion_tb_equipo}, {"direccion_ip_tb_equipo",tb_equipo.direccion_ip_tb_equipo}, {"nombre_pc_tb_equipo",tb_equipo.nombre_pc_tb_equipo}, {"pto_switch_tb_equipo",tb_equipo.pto_switch_tb_equipo}, {"serie_sw_tb_equipo",tb_equipo.serie_sw_tb_equipo}, {"pto_patch_tb_equipo",tb_equipo.pto_patch_tb_equipo}, {"inventario_tb_equipo",tb_equipo.inventario_tb_equipo}, {"direccion_mac_tb_equipo",tb_equipo.direccion_mac_tb_equipo}, {"proyecto_tb_equipo",tb_equipo.proyecto_tb_equipo}, {"perfil_tb_equipo",tb_equipo.perfil_tb_equipo}, {"proyecto_dest_tb_equipo",tb_equipo.proyecto_dest_tb_equipo}, {"estatus_tb_equipo",tb_equipo.estatus_tb_equipo}, {"serie_tb_equipo",tb_equipo.serie_tb_equipo} }; query = "SELECT * from dbo.tb_equipo where"; ViewBag.Parametros = param; //total de valores recibidos no vac?os foreach (var equipo_param in param) { if (equipo_param.Value != null) if (equipo_param.Value.ToString().Trim() != "") total++; } object[] parameters = new object[total]; //llenar la consulta con los valores recibidos desde la vista Cambios foreach (var equipo_param in param) { if (equipo_param.Value != null) if (equipo_param.Value.ToString().Trim() != "") { query += " " + equipo_param.Key + " LIKE concat('%',@p" + cont + ",'%') AND"; parameters[cont] = equipo_param.Value; cont++; } } query = query.Remove(query.LastIndexOf(' ') + 1); // List<tb_equipo> equipo = db.tb_equipo.SqlQuery(query, parameters).ToList(); List<tb_equipo> equipo = null; equipo = db.tb_equipo.SqlQuery(query, parameters).ToList(); //return View(db.tb_equipo.SqlQuery(query, parameters).ToList()); //List<tb_equipo> equipo = db.tb_equipo.SqlQuery(query, parameters).ToList(); //create object to webgrid WebGrid grid = new WebGrid(source: equipo, canPage: false, canSort: false); string gridData = grid.GetHtml( columns: grid.Columns( grid.Column("vpn_tb_equipo", "vpn_tb_equipo"), grid.Column("admon_loc_tb_equipo", "admon_loc_tb_equipo"), grid.Column("rfc8_tb_equipo", "rfc8_tb_equipo"), grid.Column("tipo_tb_equipo", "tipo_tb_equipo"), grid.Column("marca_tb_equipo", "marca_tb_equipo"), grid.Column("familia_tb_equipo", "familia_tb_equipo"), grid.Column("area_ubicacion_tb_equipo", "area_ubicacion_tb_equipo"), grid.Column("direccion_ip_tb_equipo", "direccion_ip_tb_equipo"), grid.Column("nombre_pc_tb_equipo", "nombre_pc_tb_equipo"), grid.Column("pto_switch_tb_equipo", "pto_switch_tb_equipo"), grid.Column("serie_sw_tb_equipo", "serie_sw_tb_equipo"), grid.Column("pto_patch_tb_equipo", "pto_patch_tb_equipo"), grid.Column("direccion_mac_tb_equipo", "direccion_mac_tb_equipo"), grid.Column("proyecto_tb_equipo", "proyecto_tb_equipo"), grid.Column("perfil_tb_equipo", "perfil_tb_equipo"), grid.Column("proyecto_dest_tb_equipo", "proyecto_dest_tb_equipo"), grid.Column("serie_tb_equipo", "serie_tb_equipo"), grid.Column("estatus_tb_equipo", "estatus_tb_equipo") )).ToString(); Response.ClearContent(); //give name to excel sheet. Response.AddHeader("content-disposition", "attachment; filename=UserData.xls"); //specify content type Response.ContentType = "application/excel"; //write excel data using this method Response.Write(gridData); Response.End(); }
Miguel Díaz9y ago
Nice, but I have a page of consult and the result is to the send to page of index and this result I want to export to Excel , but export all info, Don?t respect my query, you can help , me?, this is my code
Seshu B9y ago
Nice explanation...
Humayun Kabir Mamun10y ago
Nice...
Anu V10y ago
Nice
farooq smd10y ago
Nice one
Shridhar Sharma10y ago
Nice share :)
Bhavik Patel10y ago
Nice
Nigel Fernandes10y ago
Useful thanks
Rakesh10y ago
Good share
kalu singh rao10y ago
Nice share

Hi again everyone. In this tutorial, I am going to explain how to export Webgrid data into Microsoft Excel sheets. If you are new to Webgrid, please refer to the links of the posts, given below, to understand the basics of Webgrid.

If you have gone through these tutorials, you will get a basic understanding of Webgrid implementation. In this tutorial, I am going to use the code of the previous posts. I have implemented the screenshots given below of the Webgrid in the previous posts.

table

Exporting Webgrid to Excel in ASP.NET MVC

Create Visual Studio Application in (2013 or 2015).
Please refe to this tutorial Webgrid implementation in ASP.NET MVC5 Application. I am using the code in this tutorial, without creating a new Application.
I am adding an extra code to implement exporting the data.
Add ActionLink, given below, in an Index View, as shown below:
1. 
2. @Html.ActionLink("Export to Excel", "PrintExcel", "Home", new { @class="btn btn-success"})
3. <br/>
The complete code of the View is shown below:

Index.cshtml
1. @model List<WebGridinMVC5.Models.UserTable>
2. @{
3. ViewBag.Title = "www.mitechdev.com";
4. //create object for webgrid to use Webgrid helper
5. var grid = new WebGrid(source: Model, canPage: true, rowsPerPage: 7);
6. //pager
7. grid.Pager(WebGridPagerModes.All);
8. }
9. <h2>Fetching and displaying data from server in WebGrid</h2><br/>
10. 
11. @Html.ActionLink("Export to Excel", "PrintExcel", "Home", new { @class="btn btn-success"})
12. <br/>
13. 
14. <style type="text/css">
15. /*styles for altering rows*/
16. .webgrid-row-style {
17. padding: 3px 7px 2px;
18. }
19. .webgrid-alternating-row {
20. background-color: #EAF2D3;
21. padding: 3px 7px 2px;
22. }
23. </style>
24. 
25. 
26. <div id="webgrid">
27. @grid.GetHtml(
28. //styles class for table
29. //here i used bootstrap table templates
30. tableStyle: "table table-responsive backcolor",
31. headerStyle:"wedgrid-header",
32. footerStyle:"webgrid-footer",
33. alternatingRowStyle:"webgrid-alternating-row",
34. rowStyle:"webgrid-row-style",
35. //binding table column to the grid
36. columns:grid.Columns(
37. grid.Column(header:"Serial No",format:@<text><div>@(item.WebGrid.Rows.IndexOf(item)+1)</div></text>),
38. grid.Column(columnName:"Name",header:"Name"),
39. grid.Column(header:"Email", format:@<text><a href="mailto:@item.Email">@item.Email</a></text>),
40. grid.Column(columnName:"PhoneNumber",header:"Phone No"),
41. grid.Column(header:"Is Active", format:@<text><input type="checkbox" checked="@item.Status" disabled="disabled" /></text>)
42. )
43. )
44. </div>
You can get the code, shown above, from the previous post's links also (I specified above).

Create method to Export the Data into Excel

Now, add a method to export the data into Microsoft Excel format. When you click 'Export to Excel' button in an Index view page this method (PrintExcel) gets the grid data from the Server and exports it to Excel Sheet.
Replace the HomeController.cs file with the code, given below:

HomeController.cs
1. using System;
2. using System.Collections.Generic;
3. using System.Linq;
4. using System.Web;
5. using System.Web.Mvc;
6. using System.Web.Helpers;
7. using WebGridinMVC5.Models;
9. namespace WebGridinMVC5.Controllers
10. {
11. public class HomeController : Controller
12. {
13. //Fetch data from database
14. public ActionResult Index()
15. {
16. List lst = new List();
17. using (DatabaseEntities db = new DatabaseEntities())
18. {
19. lst = db.UserTables.ToList();
20. }
21. //I am passing data ti view through model binding
22. return View(lst);
24. }
25. //Added method to controller.
26. //method to export data to Excel
27. public void PrintExcel()
28. {
29. List exceldata = new List();
30. using (DatabaseEntities db = new DatabaseEntities())
31. {
32. exceldata = db.UserTables.ToList();
33. }
34. //create object to webgrid
35. WebGrid grid = new WebGrid(source: exceldata,canPage:false, canSort: false);
36. string gridData = grid.GetHtml(
37. columns: grid.Columns(
38. grid.Column("UserID", "UserID"),
39. grid.Column("Name", "Name"),
40. grid.Column("Email", "Email"),
41. grid.Column("PhoneNumber", "PhoneNumber"),
42. grid.Column("Status", "Status")
43. )).ToString();
44. Response.ClearContent();
45. //give name to excel sheet.
46. Response.AddHeader("content-disposition", "attachment; filename=UserData.xls");
47. //specify content type
48. Response.ContentType = "application/excel";
49. //write excel data using this method
50. Response.Write(gridData);
51. Response.End();
52. }
53. }
54. }
Now, run the Application and see the output.
Now, click on "Export to Excel" and you will get the Window, as shown below:

Conclusion: I hope, this blog may be helpful for many readers.