次の方法で共有


DetailsView Web サーバー コントロールを使用したデータの変更

更新 : 2007 年 11 月

DetailsView コントロールには、ユーザーがプログラミングを行うことなく、レコードを編集または削除できるようにする組み込み機能が含まれています。DetailsView コントロールの編集機能は、イベントやテンプレートを使用してカスタマイズできます。

組み込み編集機能の有効化

DetailsView コントロールの組み込みの編集機能を有効にするには、AutoGenerateEditButtonAutoGenerateInsertButton、および AutoGenerateDeleteButton のうちの 1 つ以上のプロパティに true を設定します。DetailsView コントロールのデータ ソースが編集をサポートしている場合、DetailsView コントロールは、現在のバインド レコードの編集や削除、および新しいレコードの挿入を可能にする機能を自動的に追加します。

バインドされたデータを DetailsView コントロールで変更する方法

DetailsView コントロールは、ユーザーがバインド データの内容を変更できるユーザー インターフェイス (UI: user interface) を備えています。通常、編集可能なビューには、[編集][挿入]、および [削除] の 3 つのテキストが表示されたコマンド ボタンを含む追加の行が表示されます。既定では、この行は DetailsView コントロールの下部に追加されます。

ユーザーがコマンド ボタンをクリックすると、DetailsView コントロールは、その行と、行の内容を変更できるコントロールを再表示します。編集ボタンは、変更内容を保存したり、行の編集をキャンセルしたりできるボタンに置き換えられます。AutoGenerateRows プロパティに true を設定すると、DetailsView コントロールは、テキスト ボックスを使用して BoundField のデータを表示したり、自動的にデータを表示したりします。ブール型のデータはチェック ボックスを使用して表示されます。編集モードで表示される入力コントロールは、TemplateField を使用してカスタマイズできます。詳細については、「DetailsView Web サーバー コントロールにおけるカスタム行の作成」を参照してください。

DetailsView コントロールは、挿入操作を実行する際には、データ ソース内に挿入される値を Values ディクショナリ コレクションを使用して渡します。

更新操作や削除操作では、DetailsView コントロールは、Keys ディクショナリ、NewValues ディクショナリ、OldValues ディクショナリの 3 つのディクショナリ コレクションのデータ ソースに値を渡します。各ディクショナリには、DetailsView コントロールが発生させる挿入、更新、削除の各イベントに渡されるイベント引数を使用してアクセスできます。

Keys ディクショナリには、更新または削除するレコードを一意に識別するフィールドの名前と値が格納されます。ここには、レコードが編集される前のキー フィールドの元の値が常に格納されています。Keys ディクショナリに配置するフィールドを指定するには、DataKeyNames プロパティにデータの主キーを表すフィールド名のリスト (コンマ区切り) を設定します。Keys コレクションには、DataKeyNames プロパティに指定されたフィールドに関連付けられている値が、自動的に設定されます。

ms227560.alert_note(ja-jp,VS.90).gifメモ :

DataKeyNames プロパティで指定されたフィールドの元の主キーの値は、ビューステートに格納されます。主キーの値に重要な情報が含まれるときは、ページの ViewStateEncryptionMode プロパティを Always に設定して、ビューステートの内容を暗号化する必要があります。

Values ディクショナリと NewValues ディクショナリには、それぞれ挿入または編集される入力コントロールの現在の値が含まれます。OldValues ディクショナリには、キー フィールドを除くフィールドの元の値が含まれます。キー フィールドは Keys ディクショナリに含まれています。キー フィールドの新しい値は NewValues ディクショナリに含まれます。

データ ソース コントロールは、Keys、Values、NewValues、および OldValues ディクショナリの値を、挿入、更新、または削除の各コマンドのパラメータとして使用します。バインドされた値に対して作成されたディクショナリに基づいてデータ ソース コントロールのパラメータが作成される方法については、「データ ソース コントロールがデータ連結フィールドのパラメータを作成する方法」を参照してください。

更新の後、DetailsView コントロールは ItemUpdated イベントを発生させます。このイベントにより、整合性チェックなどの更新後のロジックを実行できます。同様に、DetailsView コントロールは挿入後に ItemInserted イベントを発生させ、削除後に ItemDeleted イベントを発生させます。

更新が完了し、すべてのイベントを発生させた後で、DetailsView コントロールは更新済みデータを表示するためにデータ ソース コントロールに再バインドされます。

DetailsView コントロール内の編集ユーザー インターフェイスのカスタマイズ

既定では、DetailsView コントロールは、データ ソースのバインドされた各フィールドごとに自動的に行を生成します。DetailsView コントロールにどのフィールドをバインドするかをカスタマイズするには、AutoGenerateRows プロパティに false を設定し、DetailsView コントロールに表示するフィールドごとに BoundField コントロールを指定します。

コマンド ボタンの表示をカスタマイズするには、DetailsView コントロールの AutoGenerateEditButton プロパティに false を設定します。その後、1 つの行に対して個々の CommandField オブジェクトを追加します。たとえば、現在表示されている行を編集モードに設定する場合は、ShowEditButton プロパティに true を設定した CommandField フィールドを追加します。

バインドされた個々のフィールドを編集可能にするかどうかを指定するには、BoundField コントロールの ReadOnly プロパティを使用します。ReadOnly プロパティに false を設定した場合は、ユーザーが [編集] コマンド ボタンをクリックするとフィールドが編集可能になります。ReadOnly プロパティが true の場合、そのバインドされたフィールドは表示されますが、ユーザーがフィールドを編集することはできません。

同様に、バインドされたフィールドに値を挿入できるようにするかどうかを指定するには、BoundField コントロールの InsertVisible プロパティを使用します。InsertVisible プロパティが false の場合は、ユーザーが [新規作成] コマンド ボタンをクリックしたとき、そのバインドされたフィールドは表示されません。これが特に有効なのは、バインドされたフィールドがデータ ソースによって自動的に生成される場合です (日時スタンプや自動的にインクリメントする主キーなど)。

GridView コントロールと DetailsView コントロールを使用してデータを表示するコード例を次に示します。DetailsView コントロールは、データを変更できるように構成されています。

<%@ Page language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  Sub EmployeesDropDownList_OnSelectedIndexChanged(sender As Object, e As EventArgs)
    EmployeeDetailsView.DataBind()
  End Sub

  Sub EmployeeDetailsView_ItemUpdated(sender As Object, e As DetailsViewUpdatedEventArgs)
    EmployeesDropDownList.DataBind()
    EmployeesDropDownList.SelectedValue = e.Keys("EmployeeID").ToString()
    EmployeeDetailsView.DataBind()
  End Sub

  Sub EmployeeDetailsView_ItemDeleted(sender As Object, e As DetailsViewDeletedEventArgs)
    EmployeesDropDownList.DataBind()
  End Sub

  Sub EmployeeDetailsSqlDataSource_OnInserted(sender As Object, e As SqlDataSourceStatusEventArgs)
    Dim command As System.Data.Common.DbCommand = e.Command  
    EmployeesDropDownList.DataBind()
    EmployeesDropDownList.SelectedValue = _
      command.Parameters("@EmpID").Value.ToString()
    EmployeeDetailsView.DataBind()
  End Sub

</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
  <head runat="server">
    <title>Northwind Employees</title>
</head>
<body>
    <form id="form1" runat="server">

      <h3>Northwind Employees</h3>

        <table cellspacing="10">

          <tr>
            <td valign="top">
              <asp:DropDownList ID="EmployeesDropDownList" 
                DataSourceID="EmployeesSqlDataSource" 
                DataValueField="EmployeeID" 
                DataTextField="FullName"
                AutoPostBack="True"
                OnSelectedIndexChanged="EmployeesDropDownList_OnSelectedIndexChanged"
                RunAt="Server" />            
            </td>

            <td valign="top">                
              <asp:DetailsView ID="EmployeeDetailsView"
                DataSourceID="EmployeeDetailsSqlDataSource"
                AutoGenerateRows="false"
                AutoGenerateInsertbutton="true"
                AutoGenerateEditbutton="true"
                AutoGenerateDeletebutton="true"
                DataKeyNames="EmployeeID"     
                Gridlines="Both"
                OnItemUpdated="EmployeeDetailsView_ItemUpdated"
                OnItemDeleted="EmployeeDetailsView_ItemDeleted"      
                RunAt="server">

                <HeaderStyle backcolor="Navy"
                  forecolor="White"/>

                <RowStyle backcolor="White"/>

                <AlternatingRowStyle backcolor="LightGray"/>

                <EditRowStyle backcolor="LightCyan"/>

                <Fields>                  
                  <asp:BoundField DataField="EmployeeID" HeaderText="Employee ID" InsertVisible="False" ReadOnly="true"/>                    
                  <asp:BoundField DataField="FirstName"  HeaderText="First Name"/>
                  <asp:BoundField DataField="LastName"   HeaderText="Last Name"/>                    
                  <asp:BoundField DataField="Address"    HeaderText="Address"/>                    
                  <asp:BoundField DataField="City"       HeaderText="City"/>                        
                  <asp:BoundField DataField="Region"     HeaderText="Region"/>
                  <asp:BoundField DataField="PostalCode" HeaderText="Postal Code"/>                    
                </Fields>                    
              </asp:DetailsView>
            </td>                
          </tr>            
        </table>

        <asp:SqlDataSource ID="EmployeesSqlDataSource"  
          SelectCommand="SELECT EmployeeID, LastName + ', ' + FirstName AS FullName FROM Employees" 
          Connectionstring="<%$ ConnectionStrings:NorthwindConnection %>" 
          RunAt="server">
        </asp:SqlDataSource>


        <asp:SqlDataSource ID="EmployeeDetailsSqlDataSource" 
          SelectCommand="SELECT EmployeeID, LastName, FirstName, Address, City, Region, PostalCode
                         FROM Employees WHERE EmployeeID = @EmpID"

          InsertCommand="INSERT INTO Employees(LastName, FirstName, Address, City, Region, PostalCode)
                         VALUES (@LastName, @FirstName, @Address, @City, @Region, @PostalCode); 
                         SELECT @EmpID = SCOPE_IDENTITY()"

          UpdateCommand="UPDATE Employees SET LastName=@LastName, FirstName=@FirstName, Address=@Address,
                           City=@City, Region=@Region, PostalCode=@PostalCode
                         WHERE EmployeeID=@EmployeeID"

          DeleteCommand="DELETE Employees WHERE EmployeeID=@EmployeeID"

          ConnectionString="<%$ ConnectionStrings:NorthwindConnection %>"
          OnInserted="EmployeeDetailsSqlDataSource_OnInserted"
          RunAt="server">

          <SelectParameters>
            <asp:ControlParameter ControlID="EmployeesDropDownList" PropertyName="SelectedValue"
                                  Name="EmpID" Type="Int32" DefaultValue="0" />
          </SelectParameters>

          <InsertParameters>
            <asp:Parameter Name="LastName"   Type="String" />
            <asp:Parameter Name="FirstName"  Type="String" />
            <asp:Parameter Name="Address"    Type="String" />
            <asp:Parameter Name="City"       Type="String" />
            <asp:Parameter Name="Region"     Type="String" />
            <asp:Parameter Name="PostalCode" Type="String" />
            <asp:Parameter Name="EmpID" Direction="Output" Type="Int32" DefaultValue="0" />
          </InsertParameters>

          <UpdateParameters>
            <asp:Parameter Name="LastName"   Type="String" />
            <asp:Parameter Name="FirstName"  Type="String" />
            <asp:Parameter Name="Address"    Type="String" />
            <asp:Parameter Name="City"       Type="String" />
            <asp:Parameter Name="Region"     Type="String" />
            <asp:Parameter Name="PostalCode" Type="String" />
            <asp:Parameter Name="EmployeeID" Type="Int32" DefaultValue="0" />
          </UpdateParameters>

          <DeleteParameters>
            <asp:Parameter Name="EmployeeID" Type="Int32" DefaultValue="0" />
          </DeleteParameters>

        </asp:SqlDataSource>
      </form>
  </body>
</html>
<%@ Page language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  void EmployeesDropDownList_OnSelectedIndexChanged(Object sender, EventArgs e)
  {
    EmployeeDetailsView.DataBind();
  }

  void EmployeeDetailsView_ItemUpdated(Object sender, DetailsViewUpdatedEventArgs e)
  {
    EmployeesDropDownList.DataBind();
    EmployeesDropDownList.SelectedValue = e.Keys["EmployeeID"].ToString();
    EmployeeDetailsView.DataBind();
  }

  void EmployeeDetailsView_ItemDeleted(Object sender, DetailsViewDeletedEventArgs e)
  {
    EmployeesDropDownList.DataBind();
  }

  void EmployeeDetailsSqlDataSource_OnInserted(Object sender, SqlDataSourceStatusEventArgs e)
  {
    System.Data.Common.DbCommand command = e.Command;   
    EmployeesDropDownList.DataBind();
    EmployeesDropDownList.SelectedValue = 
      command.Parameters["@EmpID"].Value.ToString();
    EmployeeDetailsView.DataBind();
  }

</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
  <head runat="server">
    <title>Northwind Employees</title>
</head>
<body>
    <form id="form1" runat="server">

      <h3>Northwind Employees</h3>

        <table cellspacing="10">

          <tr>
            <td valign="top">
              <asp:DropDownList ID="EmployeesDropDownList" 
                DataSourceID="EmployeesSqlDataSource" 
                DataValueField="EmployeeID" 
                DataTextField="FullName"
                AutoPostBack="True"
                OnSelectedIndexChanged="EmployeesDropDownList_OnSelectedIndexChanged"
                RunAt="Server" />            
            </td>

            <td valign="top">                
              <asp:DetailsView ID="EmployeeDetailsView"
                DataSourceID="EmployeeDetailsSqlDataSource"
                AutoGenerateRows="false"
                AutoGenerateInsertbutton="true"
                AutoGenerateEditbutton="true"
                AutoGenerateDeletebutton="true"
                DataKeyNames="EmployeeID"     
                Gridlines="Both"
                OnItemUpdated="EmployeeDetailsView_ItemUpdated"
                OnItemDeleted="EmployeeDetailsView_ItemDeleted"      
                RunAt="server">

                <HeaderStyle backcolor="Navy"
                  forecolor="White"/>

                <RowStyle backcolor="White"/>

                <AlternatingRowStyle backcolor="LightGray"/>

                <EditRowStyle backcolor="LightCyan"/>

                <Fields>                  
                  <asp:BoundField DataField="EmployeeID" HeaderText="Employee ID" InsertVisible="False" ReadOnly="true"/>                    
                  <asp:BoundField DataField="FirstName"  HeaderText="First Name"/>
                  <asp:BoundField DataField="LastName"   HeaderText="Last Name"/>                    
                  <asp:BoundField DataField="Address"    HeaderText="Address"/>                    
                  <asp:BoundField DataField="City"       HeaderText="City"/>                        
                  <asp:BoundField DataField="Region"     HeaderText="Region"/>
                  <asp:BoundField DataField="PostalCode" HeaderText="Postal Code"/>                    
                </Fields>                    
              </asp:DetailsView>
            </td>                
          </tr>            
        </table>

        <asp:SqlDataSource ID="EmployeesSqlDataSource"  
          SelectCommand="SELECT EmployeeID, LastName + ', ' + FirstName AS FullName FROM Employees" 
          Connectionstring="<%$ ConnectionStrings:NorthwindConnection %>" 
          RunAt="server">
        </asp:SqlDataSource>


        <asp:SqlDataSource ID="EmployeeDetailsSqlDataSource" 
          SelectCommand="SELECT EmployeeID, LastName, FirstName, Address, City, Region, PostalCode
                         FROM Employees WHERE EmployeeID = @EmpID"

          InsertCommand="INSERT INTO Employees(LastName, FirstName, Address, City, Region, PostalCode)
                         VALUES (@LastName, @FirstName, @Address, @City, @Region, @PostalCode); 
                         SELECT @EmpID = SCOPE_IDENTITY()"

          UpdateCommand="UPDATE Employees SET LastName=@LastName, FirstName=@FirstName, Address=@Address,
                           City=@City, Region=@Region, PostalCode=@PostalCode
                         WHERE EmployeeID=@EmployeeID"

          DeleteCommand="DELETE Employees WHERE EmployeeID=@EmployeeID"

          ConnectionString="<%$ ConnectionStrings:NorthwindConnection %>"
          OnInserted="EmployeeDetailsSqlDataSource_OnInserted"
          RunAt="server">

          <SelectParameters>
            <asp:ControlParameter ControlID="EmployeesDropDownList" PropertyName="SelectedValue"
                                  Name="EmpID" Type="Int32" DefaultValue="0" />
          </SelectParameters>

          <InsertParameters>
            <asp:Parameter Name="LastName"   Type="String" />
            <asp:Parameter Name="FirstName"  Type="String" />
            <asp:Parameter Name="Address"    Type="String" />
            <asp:Parameter Name="City"       Type="String" />
            <asp:Parameter Name="Region"     Type="String" />
            <asp:Parameter Name="PostalCode" Type="String" />
            <asp:Parameter Name="EmpID" Direction="Output" Type="Int32" DefaultValue="0" />
          </InsertParameters>

          <UpdateParameters>
            <asp:Parameter Name="LastName"   Type="String" />
            <asp:Parameter Name="FirstName"  Type="String" />
            <asp:Parameter Name="Address"    Type="String" />
            <asp:Parameter Name="City"       Type="String" />
            <asp:Parameter Name="Region"     Type="String" />
            <asp:Parameter Name="PostalCode" Type="String" />
            <asp:Parameter Name="EmployeeID" Type="Int32" DefaultValue="0" />
          </UpdateParameters>

          <DeleteParameters>
            <asp:Parameter Name="EmployeeID" Type="Int32" DefaultValue="0" />
          </DeleteParameters>

        </asp:SqlDataSource>
      </form>
  </body>
</html>

参照

参照

DetailsView Web サーバー コントロールの概要