ASP 上の DataGrid でデータをエクスポートする方法。 NET WebForm から Microsoft Excel へ

[アーティクル]
06/20/2023
適用対象:

Microsoft Excel

概要

このステップバイステップガイドを使用して、ASP.NET WebForm に DataGrid Web サーバーコントロールを設定し、DataGrid の内容を Microsoft Excel にエクスポートします。

技術

この記事では、DataGrid でデータをエクスポートするための 2 つの手法について説明します。

Excel MIME の種類 (またはコンテンツタイプ) の使用

サーバー側のコードを使用すると、DataGrid をデータにバインドし、クライアントコンピューター上の Excel でデータを開くことができます。これを行うには、ContentType を application/vnd.ms-excel に設定します。クライアントが新しいストリームを受信すると、コンテンツが Web ブラウザーで新しいページとして開かれたかのようにデータが Excel に表示されます。
Excel Automation の使用

クライアント側のコードを使用すると、DataGrid から HTML を抽出し、Excel を自動化して新しいブックに HTML を表示できます。 Excel Automation では、データは常に Excel アプリケーションウィンドウのブラウザーの外部に表示されます。 Automation の利点の 1 つは、データのエクスポート後にブックを変更する場合に、プログラムで Excel を制御できることです。ただし、Excel はスクリプト作成に対して安全であるとマークされていないため、クライアントは Automation を許可する Web ブラウザーでセキュリティ設定を適用する必要があります。

ステップバイステップ

Visual Studio .NET を起動します。 [ ファイル] メニューの [ 新規] をポイントし、[ プロジェクト] をクリックします。
[プロジェクトの種類] ウィンドウで、[Visual Basic プロジェクト] をクリックします。 [テンプレート] の [ASP.NET Web アプリケーション] をクリックします。アプリケーションに ExcelExport という名前を付けて、[OK] をクリックします。

WebForm1 がデザインビューに表示されます。
ソリューションエクスプローラーで WebForm1.aspx を右クリックし、[名前の変更] をクリックします。ファイルの名前を Bottom.aspx に変更します。

[表示] メニューの [HTML ソース] をクリックして、次の DataGrid を次のデータグリッドの間に追加します。

タグ：

<asp:datagrid id="DataGrid1" runat="server" GridLines="Vertical" CellPadding="3" BackColor="White"
BorderColor="#999999" BorderWidth="1px" BorderStyle="None" Width="100%" Height="100%" Font-Size="X-Small"
Font-Names="Verdana">
<SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#008A8C"></SelectedItemStyle>
<AlternatingItemStyle BackColor="Gainsboro"></AlternatingItemStyle>
<ItemStyle BorderWidth="2px" ForeColor="Black" BorderStyle="Solid" BorderColor="Black" BackColor="#EEEEEE"></ItemStyle>
<HeaderStyle Font-Bold="True" HorizontalAlign="Center" BorderWidth="2px" ForeColor="White" BorderStyle="Solid"
BorderColor="Black" BackColor="#000084"></HeaderStyle>
<FooterStyle ForeColor="Black" BackColor="#CCCCCC"></FooterStyle>
<PagerStyle HorizontalAlign="Center" ForeColor="Black" BackColor="#999999" Mode="NumericPages"></PagerStyle>
</asp:datagrid>

[表示] メニューの [デザイン] をクリックしてデザインビューに戻ります。

DataGrid が WebForm に表示されます。

[表示] メニューの [コード] をクリックして、Web フォームの背後にコードを表示します。 Page_Load イベントハンドラーに次のコードを追加します。

メモこのコードを実行する前に、ユーザー ID <のユーザー名> と password=<strong password> を正しい値に変更する必要があります。ユーザーアカウントに、データベースに対してこの操作を実行するための適切なアクセス許可があることを確認します。

' Create a connection and open it.
Dim objConn As New System.Data.SqlClient.SqlConnection("User ID=<username>;Password=<strong password>;Initial Catalog=Northwind;Data Source=SQLServer;")
objConn.Open()

Dim strSQL As String
Dim objDataset As New DataSet()
Dim objAdapter As New System.Data.SqlClient.SqlDataAdapter()

' Get all the customers from the USA.
strSQL = "Select * from customers where country='USA'"
objAdapter.SelectCommand = New System.Data.SqlClient.SqlCommand(strSQL, objConn)
' Fill the dataset.
objAdapter.Fill(objDataset)
' Create a new view.
Dim oView As New DataView(objDataset.Tables(0))
' Set up the data grid and bind the data.
DataGrid1.DataSource = oView
DataGrid1.DataBind()

' Verify if the page is to be displayed in Excel.
If Request.QueryString("bExcel") = "1" Then
    ' Set the content type to Excel.
    Response.ContentType = "application/vnd.ms-excel"
    ' Remove the charset from the Content-Type header.
    Response.Charset = ""
    ' Turn off the view state.
    Me.EnableViewState = False

Dim tw As New System.IO.StringWriter()
    Dim hw As New System.Web.UI.HtmlTextWriter(tw)

' Get the HTML for the control.
    DataGrid1.RenderControl(hw)
    ' Write the HTML back to the browser.
    Response.Write(tw.ToString())
    ' End the response.
    Response.End()
End If

メモコード内の SQLServer をSQL Serverの名前に置き換えます。 Northwind サンプルデータベースを含むSQL Serverにアクセスできない場合は、Microsoft Access 2002 サンプル Northwind データベースを使用するように接続文字列を変更します。

provider=microsoft.jet.oledb.4.0;データソース=C:\Program Files\Microsoft Office\Office10\Samples\Northwind.mdb

このメソッドを選択する場合は、前述のコードを変更して、SqlClient 名前空間ではなく OleDbClient 名前空間を使用します。

[プロジェクト] メニューの [HTML ページの追加] をクリックします。ページTop.htmに名前を付けて、[開く] をクリックします。

Top.htmがデザインビューに表示されます。

[表示] メニューの [HTML ソース] をクリックします。 HTML ソースウィンドウの内容を次のコードに置き換えます。

<html>
<script language="vbscript">
  Sub Button1_onclick        

Select Case Select1.selectedIndex

Case 0' Use Automation.
      Dim sHTML
      sHTML = window.parent.frames("bottom").document.forms(0).children("DataGrid1").outerhtml
      Dim oXL, oBook
      Set oXL = CreateObject("Excel.Application")
      Set oBook = oXL.Workbooks.Add
      oBook.HTMLProject.HTMLProjectItems("Sheet1").Text = sHTML
      oBook.HTMLProject.RefreshDocument
      oXL.Visible = true
      oXL.UserControl = true

Case 1' Use MIME Type (In a New Window).
      window.open("bottom.aspx?bExcel=1")

Case 2' Use MIME Type (In the Frame).
      window.parent.frames("bottom").navigate "bottom.aspx?bExcel=1"
  End Select
End Sub
</script>
<body>
Export to Excel Using:
<SELECT id="Select1" size="1" name="Select1">
<OPTION value="0" selected>Automation</OPTION>
<OPTION value="1">MIME Type (In a New Window)</OPTION>
<OPTION value="2">MIME Type (In the Frame)</OPTION>
</SELECT>
<INPUT id="Button1" type="button" value="Go!" name="Button1">
</body>
</html>

[プロジェクト] メニューの [HTML ページの追加] をクリックします。ページFrameset.htmに名前を付けて、[開く] をクリックします。

Frameset.htmデザインビューで開きます。

[表示] メニューの [HTML ソース] をクリックします。 HTML ソースウィンドウの内容を次のコードに置き換えます。

<html>
<frameset rows="10%,90%">
<frame noresize="0" scrolling="no" name="top" src="top.htm">
<frame noresize="0" scrolling="yes" name="bottom" src="bottom.aspx">
</frameset>
</html>

ソリューションエクスプローラーでFrameset.htmを右クリックし、[スタートページとして設定] をクリックします。
[ ビルド] メニューで、[ ソリューションのビルド] をクリックします。

試してみてください。

[デバッグ] メニューの [デバッグなしで開始] をクリックして、アプリケーションを実行します。

Web ブラウザーでフレームセットが開くと、下のフレームの DataGrid に Northwind データベースのデータが表示されます。
ドロップダウンリストで [オートメーション] をクリックし、[移動] をクリックします。

DataGrid の内容は、Microsoft Excel アプリケーションウィンドウのブラウザーの外部に表示されます。
ドロップダウンリストで [ MIME の種類 ] ([新しいウィンドウ内]) をクリックし、[移動] をクリックします。

DataGrid の内容は、新しい Web ブラウザーウィンドウでホストされている Excel に表示されます。

メモ Excel ファイルを開くか保存するかを確認するメッセージが表示されたら、[開く] をクリックします。
ドロップダウンリストで [ MIME の種類 ] (フレーム内) をクリックし、[移動] をクリックします。

DataGrid の内容は、Web ブラウザーでホストされている Excel のフレームセットの下部フレームに表示されます。

メモ Excel ファイルを開くか保存するかを確認するメッセージが表示されたら、[開く] をクリックします。

ASP 上の DataGrid でデータをエクスポートする方法。 NET WebForm から Microsoft Excel へ

概要

技術

ステップバイステップ

試してみてください。

関連情報

その他のリソース

ASP 上の DataGrid でデータをエクスポートする方法。 NET WebForm から Microsoft Excel へ

概要

技術

ステップバイ ステップ

試してみてください。

関連情報

その他のリソース

ステップバイステップ