javascript - 如何在 Sencha/Ext JS 中下载 Excel 文件？

Question

在浏览器端的 Exjs 中保存 Excel 文件时遇到问题。

下面是我的 C# 代码，用于以 Excel 文件形式提供对 extJS 应用程序的响应。

我使用 C# 代码转换 Excel 数据表，exportToExcel() 函数返回 Excel 文件作为对 ext JS 应用程序请求的响应。

 public void exportToExcel(string userAutoId)
    {
        DataTable dt = new DataTable();
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["myConnectionString"].ConnectionString);
        con.Open();
        SqlDataAdapter da = new SqlDataAdapter("getContacts", con);
        da.SelectCommand.CommandType = CommandType.StoredProcedure;
        da.SelectCommand.Parameters.AddWithValue("@userAutoId", userAutoId);
        //cmd.Parameters.Add("@retValue", System.Data.SqlDbType.VarChar).Direction = System.Data.ParameterDirection.ReturnValue; 
        da.Fill(dt);

        //Create a dummy GridView
        GridView GridView1 = new GridView();
        GridView1.AllowPaging = false;
        GridView1.DataSource = dt;
        GridView1.DataBind();

        Response.Clear();
        Response.Buffer = true;
        Response.AddHeader("content-disposition",
         "attachment;filename=DataTable.xls");
        Response.Charset = "";
        Response.ContentType = "application/vnd.ms-excel";
        StringWriter sw = new StringWriter();
        HtmlTextWriter hw = new HtmlTextWriter(sw);

        for (int i = 0; i < GridView1.Rows.Count; i++)
        {
            //Apply text style to each Row
            GridView1.Rows[i].Attributes.Add("class", "textmode");
        }
        GridView1.RenderControl(hw);

        //style to format numbers to string
        string style = @"<style> .textmode { mso-number-format:\@; } </style>";
        Response.Write(style);
        Response.Output.Write(sw.ToString());
        Response.Flush();
        Response.End();
    }

这是我的 Ext JS 代码

                handler: function () {
                    //me = this;
                    var hfUserAutoId = me.InfoPanel.getForm().findField('hfUserAutoId').getValue();

                    var form = me.InfoPanel.getForm();
                    if (form.isValid()) {
                        form.submit({
                            url: 'getCSV.aspx',
                            method: 'POST',
                            params: { "userAutoId": hfUserAutoId },
                            waitMsg: 'Downloading your File...',
                            success: function (fp, o) {

                                                // Heare I want to do code for download respoce file

                                me.fireEvent('CloseThisEx');

                            }
                        });
                    }
                }

            }

Answer 1

您应该使用 window.open 来使用浏览器下载功能。C# 路由必须有 GET 方法，因此 userAutoId 和表单值应成为查询参数，然后 ExtJS 代码将是:

            handler: function () {
                var hfUserAutoId = me.InfoPanel.getForm().findField('hfUserAutoId').getValue(),
                    form = me.InfoPanel.getForm();

                if (form.isValid()) {
                    var params = Ext.merge(form.getValues(), {userAutoId: hfUserAutoId});
                    window.open('getCSV.aspx?' + Ext.Object.toQueryString(params), '_blank')
                }
            }