MVC 导出Execl 的总结几种方式 （四）

时间：2023-03-09 17:04:12
MVC 导出Execl 的总结几种方式 （四）

这种方式我个人还是比较喜欢的，使用部分视图的方式，导出Execl 这样在编辑样式上也是很方便的

第一步: 编辑导出视图页

@using H5UpdateImage.Models;

@{

    Layout = null;

    Response.AddHeader("Content-disposition", "attachment;filename=Order.xls");

}

@model List<Order>

<!DOCTYPE html>

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>ExeclIndex</title>

    <style type="text/css">

        .ltable th {

            padding: 8px ;

            color: #;

            font-size: 12px;

            font-weight: ;

            background: #f3f3f3;

            border-bottom: 1px solid #E1E1E1;

            line-height: .5em;

        }

        .ltable th, .ltable td {

            border: 1px solid #e1e1e1;

            text-align: center;

        }

        .ltable th {

            padding: 8px ;

            color: #;

            font-size: 12px;

            font-weight: ;

            background: #f3f3f3;

            border-bottom: 1px solid #E1E1E1;

            line-height: .5em;

        }

    </style>

</head>

<body>

    <table class="ltable">

        <thead>

            <tr>

                <th> 订单编号</th>

                <th>订单来源</th>

                <th>会员姓名</th>

            </tr>

        </thead>

        <tbody class="ltbody">

            @foreach (var item in Model)

            {

                <tr>

                    <td>@item.Id</td>

                    <td>@item.Name</td>

                    <td>@item.CreateTime</td>

                </tr>

            }

        </tbody>

    </table>

</body>

</html>

第二步： 控制代码

  /// <summary>

        /// MVC 内置视图导出Execl

        /// </summary>

        /// <returns></returns>

        public ActionResult ExeclIndex()

        {

            var list = GetList();

            return View(list);

        }

第三步： 触发导出 代码

 <a id="btnExport" href="javascript:ExportData();void(0);">导出</a>

js代码

 function ExportData() {

        window.open('@Url.Action("ExeclIndex")');

    }

相关文章