ファイルのダウンロードができますが、ファイルの保存ダイアログは開かない

Question

ASP.NET、ExtJS5、SQL ServerおよびClosedXMLを使用しています。

私はExtJSを使用してデータベースストアドプロシージャを呼び出し、その結果をClosedXMLを使用してサーバー上のExcelファイルに保存しています。

ファイルが正しく作成されていて、ネットワークインスペクタを見て、ファイルがダウンロードされていることを確認できますが、Saveのダイアログは表示されません。私が見つけたのは、そのポップアップを無効にするための解決策でした（私はその問題があるのが大好きです）。

私はChrome、Firefox、IEで同じことを試しました。

サービスを呼び出すパネル：Gusmanさんのコメント@

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(); 
} 

Answer 1

は、私が見ている可能性がどこに私が把握助けました。問題は実際にフロントエンドコードにありました。私はボタンのハンドラに、目に見えない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 
        }); 
       } 
      }) 
     } 

また、サーバーコードで変更して、サーバー上の一時フォルダにファイルを保存し、クライアントによって取得されるようにしました。