2017-07-17 72 views
0

使用ASP.NET,ExtJS5,SQL Server和ClosedXML文件下載但保存文件對話框未打開

我正在使用ExtJS調用數據庫存儲過程,並將結果保存到服務器上的帶有ClosedXML的excel文件中。

該文件正在創建正確,並看着網絡督察,我可以驗證文件正在下載,但我沒有得到任何種類的Save對話。我發現的所有解決方案都是禁用彈出窗口(我喜歡這個問題)。

我已經嘗試過Chrome,Firefox和IE,每個都有同樣的故事。

的調用該服務的面板:

Ext.define('Table', { 
    xtype: 'file-table', 
    extend: 'Ext.grid.Panel', 
    title: 'Stuff for Excel', 
    hideHeaders: false, 
    cls: 'striped-grid', 
    store: 'Stuff for Excel Store', 
    requires: [ 
     'Ext.grid.selection.SpreadsheetModel', 
     'Ext.grid.plugin.Clipboard' 
    ], 
    selModel: { 
     type: 'spreadsheet', 
     rowSelect: false, 
     columnSelect: true 
    }, 
    plugins: ['clipboard', 'gridfilters'], 
    features: [{ 
     ftype: 'grouping', 
     hideGroupedHeader: true, 
     startCollapsed: true 
    }], 
    columns: [{ 
     text: '#1', 
     dataIndex: 'Name', 
     flex: 1, 
     filter: { 
      type: 'string', 
      itemDefaults: { 
       emptyText: 'Filter by...' 
      } 
     } 
    }, { 
     text: '#2', 
     dataIndex: 'Type', 
     flex: 1, 
     hidden: true, 
     filter: { 
      type: 'string', 
      itemDefaults: { 
       emptyText: 'Filter by...' 
      } 
     } 
    }, { 
     text: '#3', 
     dataIndex: 'Sub-Type', 
     flex: 1, 
     filter: { 
      type: 'string', 
      itemDefaults: { 
       emptyText: 'Filter by...' 
      } 
     } 
    }, { 
     text: '#4', 
     dataIndex: 'Sub-sub Type', 
     flex: 1, 
     filter: { 
      type: 'string', 
      itemDefaults: { 
       emptyText: 'Filter by...' 
      } 
     } 
    }, { 
     text: '#5', 
     dataIndex: 'Weight', 
     xtype: 'numbercolumn', 
     renderer: function (value) { 
      var out = value * 100; 
      return out.toFixed(1) + ' %'; 
     }, 
     flex: 0 
    }], 
    viewConfig: { 
     stripeRows: true 
    }, 
    bbar: [{ 
     xtype: 'panel', 
     flex: 1 
    }, { 
     xtype: 'button', 
     margin: 5, 
     padding: 10, 
     text: 'Export to Excel', 
     hidden: false, 
     flex: 0, 
     icon: '../Images/ExportReport.png', 
     handler: function() { 
      Ext.Ajax.request({  
       method: 'GET', 
       loadMask: true, 
       url: 'ReportingWebServices.asmx/CreateExcel', 
       params: { 
        'here': are, 
        'some': params 
       } 
      }) 
     } 
    }] 
}); 

相關的服務器端代碼

[WebMethod] 
[ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true, XmlSerializeString = false)] 
public void CreateExcel() 
{ 
    string fileName = "Workbook.xlsx"; 
    string filePath = "path\to\file"; 
    ClosedXML.Excel.XLWorkbook workBook = new ClosedXML.Excel.XLWorkbook(); 

    // Passing params, getting results from database, 
    // building the spreadsheet 

    if (File.Exists(filePath + fileName)) 
    { 
     File.Delete(filePath + fileName); 
    } 

    workBook.SaveAs(filePath + fileName); 

    HttpContext.Current.Response.ClearContent(); 
    HttpContext.Current.Response.Clear(); 
    HttpContext.Current.Response.ContentType = "application/octet-stream"; 
    HttpContext.Current.Response.AddHeader("Content-Disposition", "attachment; filename=" + fileName + ";"); 
    HttpContext.Current.Response.TransmitFile(filePath + fileName); 
    HttpContext.Current.Response.Flush(); 
    HttpContext.Current.ApplicationInstance.CompleteRequest(); 
} 
+0

我們可以看到你如何傳輸文件,但不知道你是如何從瀏覽器調用它的。添加下載文件的代碼,而不是發送它的代碼,因爲錯誤應該在客戶端。 – Gusman

回答

0

@古斯曼的評論幫我找出我的位置可以期待。這個問題確實在前端代碼中。我添加了一個函數給我的按鈕處理程序,它附加了一個不可見的iframe。

handler: function() { 

      var fileName = 'fileName.xlsx' 

      Ext.Ajax.request({  
       method: 'GET', 
       loadMask: true, 
       url: 'ReportingWebServices.asmx/GetExcel', 
       params: { 
        'sessionId': reportingSelectedSessionGUID, 
        'userId': reportingSelectedUserGUID, 
        'timeId': reportingSelectedTimeGUID, 
        'hierarchyGroupId': reportingSelectedHierarchyGroupGUID, 
        'nodeId': reportingSelectedNodeGUID, 
        'memberId': reportingSelectedMemberGUID, 
        'fileName': fileName // Pass the filename to the controller 
       }, 
       success: function (response, opts) { 

        Ext.DomHelper.append(Ext.getBody(), { 
         tag: 'iframe', 
         frameBorder: 0, 
         width: 0, 
         height: 0, 
         css: 'display:none;visibility:hidden;height:0px;', 
         src: '../Temp/' + fileName // Grab that same file that's created 
        }); 
       } 
      }) 
     } 

我也修改了服務器代碼以將文件保存到服務器上的臨時文件夾,以供客戶端檢索。

相關問題