데이터 삽입, 업데이트 및 삭제에 대 한 개요 (VB)An Overview of Inserting, Updating, and Deleting Data (VB)

Scott Mitchellby Scott Mitchell

샘플 앱 다운로드 또는 PDF 다운로드Download Sample App or Download PDF

이 자습서에서는 ObjectDataSource의 Insert (), Update () 및 Delete () 메서드를 BLL 클래스의 메서드에 매핑하는 방법 뿐만 아니라 GridView, DetailsView 및 FormView 컨트롤을 구성 하 여 데이터 수정 기능을 제공 하는 방법을 알아봅니다.In this tutorial we'll see how to map an ObjectDataSource's Insert(), Update(), and Delete() methods to the methods of BLL classes, as well as how to configure the GridView, DetailsView, and FormView controls to provide data modification capabilities.

소개Introduction

지난 몇 가지 자습서에서 GridView, DetailsView 및 FormView 컨트롤을 사용 하 여 ASP.NET 페이지에 데이터를 표시 하는 방법을 살펴보았습니다.Over the past several tutorials we've examined how to display data in an ASP.NET page using the GridView, DetailsView, and FormView controls. 이러한 컨트롤은 제공 된 데이터에 대해서만 작동 합니다.These controls simply work with data supplied to them. 일반적으로 이러한 컨트롤은 ObjectDataSource와 같은 데이터 소스 컨트롤을 사용 하 여 데이터에 액세스 합니다.Commonly, these controls access data through the use of a data source control, such as the ObjectDataSource. ObjectDataSource가 ASP.NET 페이지와 기본 데이터 간의 프록시로 작동 하는 방법을 살펴보았습니다.We've seen how the ObjectDataSource acts as a proxy between the ASP.NET page and the underlying data. GridView는 데이터를 표시 해야 하는 경우 해당 ObjectDataSource의 Select() 메서드를 호출 합니다 .이 메서드는 적절 한 DAL (데이터 액세스 계층) TableAdapter의 메서드를 호출 하는 BLL (비즈니스 논리 계층)에서 메서드를 호출 하 고이 메서드를 사용 하 여 SELECT 쿼리를 Northwind 데이터베이스로 보냅니다.When a GridView needs to display data, it invokes its ObjectDataSource's Select() method, which in turn invokes a method from our Business Logic Layer (BLL), which calls a method in the appropriate Data Access Layer's (DAL) TableAdapter, which in turn sends a SELECT query to the Northwind database.

첫 번째 자습서의 DAL에서 tableadapter를 만들 때 Visual Studio는 기본 데이터베이스 테이블에서 데이터를 삽입, 업데이트 및 삭제 하는 메서드를 자동으로 추가 했습니다.Recall that when we created the TableAdapters in the DAL in our first tutorial, Visual Studio automatically added methods for inserting, updating, and deleting data from the underlying database table. 또한 비즈니스 논리 계층을 만들 때 BLL에서 이러한 데이터 수정 DAL 메서드로 호출 된 메서드를 디자인 했습니다.Moreover, in Creating a Business Logic Layer we designed methods in the BLL that called down into these data modification DAL methods.

ObjectDataSource에는 Select() 메서드 외에도 Insert(), Update()Delete() 메서드가 있습니다.In addition to its Select() method, the ObjectDataSource also has Insert(), Update(), and Delete() methods. Select() 메서드와 마찬가지로이 세 가지 메서드는 기본 개체의 메서드에 매핑될 수 있습니다.Like the Select() method, these three methods can be mapped to methods in an underlying object. 데이터를 삽입, 업데이트 또는 삭제 하도록 구성 된 경우 GridView, DetailsView 및 FormView 컨트롤은 기본 데이터를 수정 하기 위한 사용자 인터페이스를 제공 합니다.When configured to insert, update, or delete data, the GridView, DetailsView, and FormView controls provide a user interface for modifying the underlying data. 이 사용자 인터페이스는 ObjectDataSource의 Insert(), Update()Delete() 메서드를 호출한 다음 기본 개체의 연결 된 메서드를 호출 합니다 (그림 1 참조).This user interface calls the Insert(), Update(), and Delete() methods of the ObjectDataSource, which then invoke the underlying object's associated methods (see Figure 1).

ObjectDataSource의 Insert (), Update () 및 Delete () 메서드 BLL에 프록시로 사용 됩니다.The ObjectDataSource's Insert(), Update(), and Delete() Methods Serve as a Proxy into the BLL

그림 1: ObjectDataSource의 Insert(), Update()Delete() 메서드가 BLL (전체 크기 이미지를 보려면 클릭)에 대 한 프록시 역할을 합니다.Figure 1: The ObjectDataSource's Insert(), Update(), and Delete() Methods Serve as a Proxy into the BLL (Click to view full-size image)

이 자습서에서는 ObjectDataSource의 Insert(), Update()Delete() 메서드를 BLL 클래스의 메서드에 매핑하는 방법 뿐만 아니라 GridView, DetailsView 및 FormView 컨트롤을 구성 하 여 데이터 수정 기능을 제공 하는 방법을 알아봅니다.In this tutorial we'll see how to map the ObjectDataSource's Insert(), Update(), and Delete() methods to methods of classes in the BLL, as well as how to configure the GridView, DetailsView, and FormView controls to provide data modification capabilities.

1 단계: 삽입, 업데이트 및 삭제 자습서 웹 페이지 만들기Step 1: Creating the Insert, Update, and Delete Tutorials Web Pages

데이터를 삽입, 업데이트 및 삭제 하는 방법에 대 한 탐색을 시작 하기 전에 먼저 웹 사이트 프로젝트에서이 자습서에 필요한 ASP.NET 페이지와 그 다음 몇 가지 페이지를 만들어 보겠습니다.Before we start exploring how to insert, update, and delete data, let's first take a moment to create the ASP.NET pages in our website project that we'll need for this tutorial and the next several ones. EditInsertDelete이라는 새 폴더를 추가 하 여 시작 합니다.Start by adding a new folder named EditInsertDelete. 그런 다음, 다음 ASP.NET 페이지를 해당 폴더에 추가 하 여 각 페이지를 Site.master 마스터 페이지에 연결 합니다.Next, add the following ASP.NET pages to that folder, making sure to associate each page with the Site.master master page:

  • Default.aspx
  • Basics.aspx
  • DataModificationEvents.aspx
  • ErrorHandling.aspx
  • UIValidation.aspx
  • CustomizedUI.aspx
  • OptimisticConcurrency.aspx
  • ConfirmationOnDelete.aspx
  • UserLevelAccess.aspx

데이터 수정 관련 자습서에 대 한 ASP.NET 페이지 추가

그림 2: 데이터 수정 관련 자습서에 대 한 ASP.NET 페이지 추가Figure 2: Add the ASP.NET Pages for the Data Modification-Related Tutorials

다른 폴더와 마찬가지로 EditInsertDelete 폴더의 Default.aspx에는 해당 섹션의 자습서가 나열 됩니다.Like in the other folders, Default.aspx in the EditInsertDelete folder will list the tutorials in its section. SectionLevelTutorialListing.ascx 사용자 정의 컨트롤은이 기능을 제공 합니다.Recall that the SectionLevelTutorialListing.ascx User Control provides this functionality. 따라서이 사용자 정의 컨트롤을 솔루션 탐색기에서 페이지의 디자인 뷰 끌어 Default.aspx에 추가 합니다.Therefore, add this User Control to Default.aspx by dragging it from the Solution Explorer onto the page's Design view.

SectionLevelTutorialListing 사용자 정의 컨트롤을 Default.aspx에 추가 Add the SectionLevelTutorialListing.ascx User Control to Default.aspx

그림 3: Default.aspxSectionLevelTutorialListing.ascx 사용자 정의 컨트롤 추가 (전체 크기 이미지를 보려면 클릭)Figure 3: Add the SectionLevelTutorialListing.ascx User Control to Default.aspx (Click to view full-size image)

마지막으로 Web.sitemap 파일에 페이지를 항목으로 추가 합니다.Lastly, add the pages as entries to the Web.sitemap file. 구체적으로, 사용자 지정 된 서식 <siteMapNode>뒤에 다음 태그를 추가 합니다.Specifically, add the following markup after the Customized Formatting <siteMapNode>:

<siteMapNode title="Editing, Inserting, and Deleting" url="~/EditInsertDelete/Default.aspx" description="Samples of Reports that Provide Editing, Inserting, and Deleting Capabilities"> <siteMapNode url="~/EditInsertDelete/Basics.aspx" title="Basics" description="Examines the basics of data modification with the GridView, DetailsView, and FormView controls." /> <siteMapNode url="~/EditInsertDelete/DataModificationEvents.aspx" title="Data Modification Events" description="Explores the events raised by the ObjectDataSource pertinent to data modification." /> <siteMapNode url="~/EditInsertDelete/ErrorHandling.aspx" title="Error Handling" description="Learn how to gracefully handle exceptions raised during the data modification workflow." /> <siteMapNode url="~/EditInsertDelete/UIValidation.aspx" title="Adding Data Entry Validation" description="Help prevent data entry errors by providing validation." /> <siteMapNode url="~/EditInsertDelete/CustomizedUI.aspx" title="Customize the User Interface" description="Customize the editing and inserting user interfaces." /> <siteMapNode url="~/EditInsertDelete/OptimisticConcurrency.aspx" title="Optimistic Concurrency" description="Learn how to help prevent simultaneous users from overwritting one another s changes." /> <siteMapNode url="~/EditInsertDelete/ConfirmationOnDelete.aspx" title="Confirm On Delete" description="Prompt a user for confirmation when deleting a record." /> <siteMapNode url="~/EditInsertDelete/UserLevelAccess.aspx" title="Limit Capabilities Based on User" description="Learn how to limit the data modification functionality based on the user role or permissions." /> </siteMapNode>

Web.sitemap업데이트 한 후 브라우저를 통해 자습서 웹 사이트를 잠시 기다려 주십시오.After updating Web.sitemap, take a moment to view the tutorials website through a browser. 이제 왼쪽의 메뉴에는 자습서 편집, 삽입 및 삭제를 위한 항목이 포함 되어 있습니다.The menu on the left now includes items for the editing, inserting, and deleting tutorials.

이제 사이트 맵에 자습서 편집, 삽입 및 삭제에 대 한 항목이 포함 됩니다.

그림 4: 이제 사이트 맵에 편집, 삽입 및 삭제 자습서에 대 한 항목이 포함 되어 있습니다.Figure 4: The Site Map Now Includes Entries for the Editing, Inserting, and Deleting Tutorials

2 단계: ObjectDataSource 컨트롤 추가 및 구성Step 2: Adding and Configuring the ObjectDataSource Control

GridView, DetailsView 및 FormView는 각각 데이터 수정 기능과 레이아웃에 따라 다르므로 각각을 하나씩 살펴보겠습니다.Since the GridView, DetailsView, and FormView each differ in their data modification capabilities and layout, let's examine each one individually. 그러나 각 컨트롤에 자체 ObjectDataSource를 사용 하는 대신 세 개의 컨트롤 예제 모두에서 공유할 수 있는 단일 ObjectDataSource만 만들면 됩니다.Rather than have each control using its own ObjectDataSource, however, let's just create a single ObjectDataSource that all three control examples can share.

Basics.aspx 페이지를 열고, 도구 상자에서 ObjectDataSource를 디자이너로 끌고, 스마트 태그에서 데이터 소스 구성 링크를 클릭 합니다.Open the Basics.aspx page, drag an ObjectDataSource from the Toolbox onto the Designer, and click the Configure Data Source link from its smart tag. ProductsBLL는 편집, 삽입 및 삭제 메서드를 제공 하는 유일한 BLL 클래스 이므로이 클래스를 사용 하도록 ObjectDataSource를 구성 합니다.Since the ProductsBLL is the only BLL class that provides editing, inserting, and deleting methods, configure the ObjectDataSource to use this class.

ProductsBLL 클래스를 사용 하도록 ObjectDataSource 구성 Configure the ObjectDataSource to Use the ProductsBLL Class

그림 5: ProductsBLL 클래스를 사용 하도록 ObjectDataSource 구성 (전체 크기 이미지를 보려면 클릭)Figure 5: Configure the ObjectDataSource to Use the ProductsBLL Class (Click to view full-size image)

다음 화면에서 적절 한 탭을 선택 하 고 드롭다운 목록에서 메서드를 선택 하 여 ObjectDataSource의 Select(), Insert(), Update()Delete()에 매핑되는 ProductsBLL 클래스의 메서드를 지정할 수 있습니다.In the next screen we can specify what methods of the ProductsBLL class are mapped to the ObjectDataSource's Select(), Insert(), Update(), and Delete() by selecting the appropriate tab and choosing the method from the drop-down list. 그림 6은 이제 알아 두어야 하 고 ObjectDataSource의 Select() 메서드를 ProductsBLL 클래스의 GetProducts() 메서드에 매핑합니다.Figure 6, which should look familiar by now, maps the ObjectDataSource's Select() method to the ProductsBLL class's GetProducts() method. 목록에서 맨 위를 따라 적절 한 탭을 선택 하 여 Insert(), Update()Delete() 메서드를 구성할 수 있습니다.The Insert(), Update(), and Delete() methods can be configured by selecting the appropriate tab from the list along the top.

ObjectDataSource에서 모든 제품을 반환 Have the ObjectDataSource Return All of the Products

그림 6: ObjectDataSource가 모든 제품을 반환 하도록 합니다 (전체 크기 이미지를 보려면 클릭).Figure 6: Have the ObjectDataSource Return All of the Products (Click to view full-size image)

그림 7, 8 및 9에는 ObjectDataSource의 업데이트, 삽입 및 삭제 탭이 표시 됩니다.Figures 7, 8, and 9 show the ObjectDataSource's UPDATE, INSERT, and DELETE tabs. Insert(), Update()Delete() 메서드가 ProductsBLL 클래스의 UpdateProduct, AddProductDeleteProduct 메서드를 각각 호출 하도록 이러한 탭을 구성 합니다.Configure these tabs so that the Insert(), Update(), and Delete() methods invoke the ProductsBLL class's UpdateProduct, AddProduct, and DeleteProduct methods, respectively.

ObjectDataSource의 Update () 메서드를 Product Bll 클래스의 UpdateProduct 메서드에 매핑합니다.Map the ObjectDataSource's Update() Method to the ProductBLL Class's UpdateProduct Method

그림 7: ObjectDataSource의 Update() 메서드를 ProductBLL 클래스의 UpdateProduct 메서드에 매핑 (전체 크기 이미지를 보려면 클릭)Figure 7: Map the ObjectDataSource's Update() Method to the ProductBLL Class's UpdateProduct Method (Click to view full-size image)

ObjectDataSource의 Insert () 메서드를 Product Bll 클래스의 AddProduct 메서드에 매핑합니다.Map the ObjectDataSource's Insert() Method to the ProductBLL Class's AddProduct Method

그림 8: ObjectDataSource의 Insert() 메서드를 ProductBLL 클래스의 Add Product 메서드에 매핑 (전체 크기 이미지를 보려면 클릭)Figure 8: Map the ObjectDataSource's Insert() Method to the ProductBLL Class's Add Product Method (Click to view full-size image)

ObjectDataSource의 Delete () 메서드를 Product Bll 클래스의 DeleteProduct 메서드에 매핑합니다 Map the ObjectDataSource's Delete() Method to the ProductBLL Class's DeleteProduct Method

그림 9: ObjectDataSource의 Delete() 메서드를 ProductBLL 클래스의 DeleteProduct 메서드에 매핑 (전체 크기 이미지를 보려면 클릭)Figure 9: Map the ObjectDataSource's Delete() Method to the ProductBLL Class's DeleteProduct Method (Click to view full-size image)

업데이트, 삽입 및 삭제 탭의 드롭다운 목록에 이러한 메서드가 이미 선택 되어 있는 것을 알 수 있습니다.You may have noticed that the drop-down lists in the UPDATE, INSERT, and DELETE tabs already had these methods selected. 이는 ProductsBLL의 메서드를 데코레이팅하는 DataObjectMethodAttribute을 사용 하기 위한 것입니다.This is thanks to our use of the DataObjectMethodAttribute that decorates the methods of ProductsBLL. 예를 들어 DeleteProduct 메서드의 시그니처는 다음과 같습니다.For example, the DeleteProduct method has the following signature:

<System.ComponentModel.DataObjectMethodAttribute _ (System.ComponentModel.DataObjectMethodType.Delete, True)> _ Public Function DeleteProduct(ByVal productID As Integer) As Boolean End Function

DataObjectMethodAttribute 특성은 선택, 삽입, 업데이트 또는 삭제에 대 한 각 방법의 용도와 기본값 인지 여부를 나타냅니다.The DataObjectMethodAttribute attribute indicates the purpose of each method whether it is for selecting, inserting, updating, or deleting and whether or not it's the default value. BLL 클래스를 만들 때 이러한 특성을 생략 한 경우 업데이트, 삽입 및 삭제 탭에서 수동으로 메서드를 선택 해야 합니다.If you omitted these attributes when creating your BLL classes, you'll need to manually select the methods from the UPDATE, INSERT, and DELETE tabs.

적절 한 ProductsBLL 메서드가 ObjectDataSource의 Insert(), Update()Delete() 메서드에 매핑되는지 확인 한 후 마침을 클릭 하 여 마법사를 완료 합니다.After ensuring that the appropriate ProductsBLL methods are mapped to the ObjectDataSource's Insert(), Update(), and Delete() methods, click Finish to complete the wizard.

ObjectDataSource의 태그 검사Examining the ObjectDataSource's Markup

마법사를 통해 ObjectDataSource를 구성한 후 원본 뷰로 이동 하 여 생성 된 선언적 태그를 검사 합니다.After configuring the ObjectDataSource through its wizard, go to the Source view to examine the generated declarative markup. <asp:ObjectDataSource> 태그는 내부 개체와 호출할 메서드를 지정 합니다.The <asp:ObjectDataSource> tag specifies the underlying object and the methods to invoke. 또한 ProductsBLL 클래스의 AddProduct, UpdateProductDeleteProduct 메서드에 대 한 입력 매개 변수에 매핑되는 DeleteParameters, UpdateParametersInsertParameters 있습니다.Additionally, there are DeleteParameters, UpdateParameters, and InsertParameters that map to the input parameters for the ProductsBLL class's AddProduct, UpdateProduct, and DeleteProduct methods:

<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" DeleteMethod="DeleteProduct" InsertMethod="AddProduct" OldValuesParameterFormatString="original_{0}" SelectMethod="GetProducts" TypeName="ProductsBLL" UpdateMethod="UpdateProduct"> <DeleteParameters> <asp:Parameter Name="productID" Type="Int32" /> </DeleteParameters> <UpdateParameters> <asp:Parameter Name="productName" Type="String" /> <asp:Parameter Name="supplierID" Type="Int32" /> <asp:Parameter Name="categoryID" Type="Int32" /> <asp:Parameter Name="quantityPerUnit" Type="String" /> <asp:Parameter Name="unitPrice" Type="Decimal" /> <asp:Parameter Name="unitsInStock" Type="Int16" /> <asp:Parameter Name="unitsOnOrder" Type="Int16" /> <asp:Parameter Name="reorderLevel" Type="Int16" /> <asp:Parameter Name="discontinued" Type="Boolean" /> <asp:Parameter Name="productID" Type="Int32" /> </UpdateParameters> <InsertParameters> <asp:Parameter Name="productName" Type="String" /> <asp:Parameter Name="supplierID" Type="Int32" /> <asp:Parameter Name="categoryID" Type="Int32" /> <asp:Parameter Name="quantityPerUnit" Type="String" /> <asp:Parameter Name="unitPrice" Type="Decimal" /> <asp:Parameter Name="unitsInStock" Type="Int16" /> <asp:Parameter Name="unitsOnOrder" Type="Int16" /> <asp:Parameter Name="reorderLevel" Type="Int16" /> <asp:Parameter Name="discontinued" Type="Boolean" /> </InsertParameters> </asp:ObjectDataSource>

ObjectDataSource에는 연결 된 메서드에 대 한 각 입력 매개 변수에 대 한 매개 변수가 포함 되어 있습니다 .이 목록에는 GetProductsByCategoryID(categoryID)와 같이 입력 매개 변수를 필요로 하는 select 메서드를 호출 하도록 ObjectDataSource가 구성 된 경우와 마찬가지로 SelectParameter의 목록이 표시 됩니다.The ObjectDataSource includes a parameter for each of the input parameters for its associated methods, just like a list of SelectParameter s is present when the ObjectDataSource is configured to call a select method that expects an input parameter (such as GetProductsByCategoryID(categoryID)). 곧 볼 수 있듯이 이러한 DeleteParameters, UpdateParametersInsertParameters에 대 한 값은 ObjectDataSource의 Insert(), Update()또는 Delete() 메서드를 호출 하기 전에 GridView, DetailsView 및 FormView에서 자동으로 설정 됩니다.As we'll see shortly, values for these DeleteParameters, UpdateParameters, and InsertParameters are set automatically by the GridView, DetailsView, and FormView prior to invoking the ObjectDataSource's Insert(), Update(), or Delete() method. 이후 자습서에서 설명 하는 대로 필요에 따라 이러한 값을 프로그래밍 방식으로 설정할 수도 있습니다.These values can also be set programmatically as needed, as we'll discuss in a future tutorial.

마법사를 사용 하 여 ObjectDataSource로 구성 하는 한 가지 부작용은 Visual Studio가 Oldvaluesparameterformatstring 속성original_{0}로 설정 한다는 것입니다.One side effect of using the wizard to configure to ObjectDataSource is that Visual Studio sets the OldValuesParameterFormatString property to original_{0}. 이 속성 값은 편집 중인 데이터의 원래 값을 포함 하는 데 사용 되며 다음과 같은 두 가지 시나리오에서 유용 합니다.This property value is used to include the original values of the data being edited and is useful in two scenarios:

  • 이면 레코드를 편집할 때 사용자가 기본 키 값을 변경할 수 있습니다.If, when editing a record, users are able to change the primary key value. 이 경우 원래 기본 키 값이 있는 레코드를 찾아 해당 값을 적절 하 게 업데이트 하려면 새 기본 키 값과 원래 기본 키 값을 모두 제공 해야 합니다.In this case, both the new primary key value and the original primary key value must be provided so that the record with the original primary key value can be found and have its value updated accordingly.
  • 낙관적 동시성을 사용 하는 경우.When using optimistic concurrency. 낙관적 동시성은 두 명의 동시 사용자가 다른 사용자의 변경 내용을 덮어쓰지 않도록 하는 기술 이며 이후 자습서에 대 한 항목입니다.Optimistic concurrency is a technique to ensure that two simultaneous users don't overwrite one another's changes, and is the topic for a future tutorial.

OldValuesParameterFormatString 속성은 원래 값에 대 한 기본 개체의 update 및 delete 메서드에서 입력 매개 변수의 이름을 나타냅니다.The OldValuesParameterFormatString property indicates the name of the input parameters in the underlying object's update and delete methods for the original values. 낙관적 동시성을 탐색 하는 경우이 속성과 용도에 대해 더 자세히 설명 합니다.We'll discuss this property and its purpose in greater detail when we explore optimistic concurrency. 그러나 현재 BLL의 메서드에 원래 값이 필요 하지 않으므로이 속성을 제거 하는 것이 중요 합니다.I bring it up now, however, because our BLL's methods do not expect the original values and therefore it's important that we remove this property. OldValuesParameterFormatString 속성을 기본값 ({0}) 이외의 값으로 설정 하면 ObjectDataSource가 지정 된 UpdateParameters 또는 DeleteParameters를 원래 값 매개 변수로 전달 하려고 하므로 데이터 웹 컨트롤에서 ObjectDataSource의 Update() 또는 Delete() 메서드를 호출 하려고 하면 오류가 발생 합니다.Leaving the OldValuesParameterFormatString property set to anything other than the default ({0}) will cause an error when a data Web control attempts to invoke the ObjectDataSource's Update() or Delete() methods because the ObjectDataSource will attempt to pass in both the UpdateParameters or DeleteParameters specified as well as original value parameters.

이 분기 시점에 대해 그다지 명확 하지 않은 경우에는이 속성 및 해당 유틸리티를 나중에 살펴보겠습니다.If this isn't terribly clear at this juncture, don't worry, we'll examine this property and its utility in a future tutorial. 지금은 선언적 구문에서이 속성 선언을 완전히 제거 하거나 값을 기본값 ({0})으로 설정 해야 합니다.For now, just be certain to either remove this property declaration entirely from the declarative syntax or set the value to the default value ({0}).

Note

디자인 뷰의 속성 창에서 OldValuesParameterFormatString 속성 값을 제거 하는 경우에도 해당 속성은 선언적 구문에 있지만 빈 문자열로 설정 됩니다.If you simply clear out the OldValuesParameterFormatString property value from the Properties window in the Design view, the property will still exist in the declarative syntax, but be set to an empty string. 그러나이 경우에도 위에서 설명한 것과 동일한 문제가 발생 합니다.This, unfortunately, will still result in the same problem discussed above. 따라서 선언적 구문에서 속성을 완전히 제거 하거나 속성 창에서 값을 기본값인 {0}로 설정 합니다.Therefore, either remove the property altogether from the declarative syntax or, from the Properties window, set the value to the default, {0}.

3 단계: 데이터 웹 컨트롤을 추가 하 고 데이터를 수정 하기 위해 구성Step 3: Adding a Data Web Control and Configuring It for Data Modification

ObjectDataSource가 페이지에 추가 되 고 구성 되 면 데이터 웹 컨트롤을 페이지에 추가 하 여 데이터를 표시 하 고 최종 사용자가 수정할 수 있는 수단을 제공할 준비가 된 것입니다.Once the ObjectDataSource has been added to the page and configured, we're ready to add data Web controls to the page to both display the data and provide a means for the end user to modify it. 이러한 데이터 웹 컨트롤은 데이터 수정 기능 및 구성 마다 다르므로 GridView, DetailsView 및 FormView를 별도로 살펴보겠습니다.We'll look at the GridView, DetailsView, and FormView separately, as these data Web controls differ in their data modification capabilities and configuration.

이 문서의 나머지 부분에서 볼 수 있듯이, GridView, DetailsView 및 FormView 컨트롤을 통한 매우 기본적인 편집, 삽입 및 삭제 지원을 추가 하는 것은 사실 몇 가지 확인란을 선택 하는 것 만큼 간단 합니다.As we'll see in the remainder of this article, adding very basic editing, inserting, and deleting support through the GridView, DetailsView, and FormView controls is really as simple as checking a couple of checkboxes. 실제 세계에는 단지 point와 클릭 보다 이러한 기능을 더 많이 제공 하는 많은 세부 사항 및에 지 사례가 있습니다.There are many subtleties and edge cases in the real-world that make providing such functionality more involved than just point and click. 그러나이 자습서는 단순한 데이터 수정 기능을 입증 하는 데만 초점을 맞춘 것입니다.This tutorial, however, focuses solely on proving simplistic data modification capabilities. 이후 자습서에서는 실제 설정에서 문제가 발생 하는 문제를 조사 합니다.Future tutorials will examine concerns that will undoubtedly arise in a real-world setting.

GridView에서 데이터 삭제Deleting Data from the GridView

먼저 도구 상자에서 디자이너로 GridView를 끌어 옵니다.Start by dragging a GridView from the Toolbox onto the Designer. 그런 다음 GridView의 스마트 태그에 있는 드롭다운 목록에서 선택 하 여 ObjectDataSource를 GridView에 바인딩합니다.Next, bind the ObjectDataSource to the GridView by selecting it from the drop-down list in the GridView's smart tag. 이 시점에서 GridView의 선언 태그는 다음과 같습니다.At this point the GridView's declarative markup will be:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1"> <Columns> <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False" ReadOnly="True" SortExpression="ProductID" /> <asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" /> <asp:BoundField DataField="SupplierID" HeaderText="SupplierID" SortExpression="SupplierID" /> <asp:BoundField DataField="CategoryID" HeaderText="CategoryID" SortExpression="CategoryID" /> <asp:BoundField DataField="QuantityPerUnit" HeaderText="QuantityPerUnit" SortExpression="QuantityPerUnit" /> <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" /> <asp:BoundField DataField="UnitsInStock" HeaderText="UnitsInStock" SortExpression="UnitsInStock" /> <asp:BoundField DataField="UnitsOnOrder" HeaderText="UnitsOnOrder" SortExpression="UnitsOnOrder" /> <asp:BoundField DataField="ReorderLevel" HeaderText="ReorderLevel" SortExpression="ReorderLevel" /> <asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued" SortExpression="Discontinued" /> <asp:BoundField DataField="CategoryName" HeaderText="CategoryName" ReadOnly="True" SortExpression="CategoryName" /> <asp:BoundField DataField="SupplierName" HeaderText="SupplierName" ReadOnly="True" SortExpression="SupplierName" /> </Columns> </asp:GridView>

해당 스마트 태그를 통해 ObjectDataSource에 GridView를 바인딩하면 다음과 같은 두 가지 이점이 있습니다.Binding the GridView to the ObjectDataSource through its smart tag has two benefits:

  • ObjectDataSource에서 반환 하는 각 필드에 대해 BoundFields 및 CheckBoxFields가 자동으로 만들어집니다.BoundFields and CheckBoxFields are automatically created for each of the fields returned by the ObjectDataSource. 또한 BoundField 및 CheckBoxField의 속성은 기본 필드의 메타 데이터를 기반으로 설정 됩니다.Moreover, the BoundField and CheckBoxField's properties are set based on the underlying field's metadata. 예를 들어 ProductID, CategoryNameSupplierName 필드는 ProductsDataTable에서 읽기 전용으로 표시 되므로 편집할 때 업데이트할 수 없습니다.For example, the ProductID, CategoryName, and SupplierName fields are marked as read-only in the ProductsDataTable and therefore shouldn't be updatable when editing. 이를 수용 하기 위해 이러한 BoundFields의 ReadOnly 속성True로 설정 됩니다.To accommodate this, these BoundFields' ReadOnly properties are set to True.
  • DataKeyNames 속성 은 기본 개체의 기본 키 필드에 할당 됩니다.The DataKeyNames property is assigned to the primary key field(s) of the underlying object. 이 속성은 데이터를 편집 하거나 삭제 하는 데 GridView를 사용할 때 반드시 필요 합니다 .이 속성은 각 레코드를 고유 하 게 식별 하는 필드 또는 필드 집합을 나타냅니다.This is essential when using the GridView for editing or deleting data, as this property indicates the field (or set of fields) that unique identifies each record. DataKeyNames 속성에 대 한 자세한 내용은 세부 정보 DetailView 자습서에서 선택 가능한 마스터 GridView를 사용 하 여 마스터/세부 정보를 다시 참조 하세요.For more information on the DataKeyNames property, refer back to the Master/Detail Using a Selectable Master GridView with a Details DetailView tutorial.

GridView를 속성 창 또는 선언 구문을 통해 ObjectDataSource에 바인딩할 수 있지만 이렇게 하려면 적절 한 BoundField 및 DataKeyNames 태그를 수동으로 추가 해야 합니다.While the GridView can be bound to the ObjectDataSource through the Properties window or declarative syntax, doing so requires you to manually add the appropriate BoundField and DataKeyNames markup.

GridView 컨트롤은 행 수준 편집 및 삭제에 대 한 기본 제공 지원을 제공 합니다.The GridView control provides built-in support for row-level editing and deleting. 삭제를 지원 하도록 GridView를 구성 하면 삭제 단추의 열이 추가 됩니다.Configuring a GridView to support deleting adds a column of Delete buttons. 최종 사용자가 특정 행에 대 한 삭제 단추를 클릭 하면 다시 게시 ensues 및 GridView가 다음 단계를 수행 합니다.When the end user clicks the Delete button for a particular row, a postback ensues and the GridView performs the following steps:

  1. ObjectDataSource의 DeleteParameters 값이 할당 됩니다.The ObjectDataSource's DeleteParameters value(s) are assigned
  2. ObjectDataSource의 Delete() 메서드가 호출 되 고 지정 된 레코드를 삭제 합니다.The ObjectDataSource's Delete() method is invoked, deleting the specified record
  3. GridView는 Select() 메서드를 호출 하 여 ObjectDataSource에 다시 바인딩합니다.The GridView rebinds itself to the ObjectDataSource by invoking its Select() method

DeleteParameters에 할당 되는 값은 삭제 단추를 클릭 한 행에 대 한 DataKeyNames 필드의 값입니다.The values assigned to the DeleteParameters are the values of the DataKeyNames field(s) for the row whose Delete button was clicked. 따라서 GridView의 DataKeyNames 속성을 올바르게 설정 하는 것이 중요 합니다.Therefore it's vital that a GridView's DataKeyNames property be correctly set. 누락 된 경우 1 단계에서 DeleteParametersNothing 값이 할당 됩니다. 그러면 2 단계에서 삭제 된 레코드가 반환 되지 않습니다.If it's missing, the DeleteParameters will be assigned a value of Nothing in Step 1, which in turn will not result in any deleted records in Step 2.

Note

DataKeys 컬렉션은 gridview의 컨트롤 상태에 저장 됩니다. 즉, GridView의 뷰 상태가 사용 하지 않도록 설정 된 경우에도 DataKeys 값이 포스트백을 통해 기억 됩니다.The DataKeys collection is stored in the GridView s control state, meaning that the DataKeys values will be remembered across postback even if the GridView s view state has been disabled. 그러나 편집 또는 삭제 (기본 동작)를 지 원하는 GridViews에 대해 뷰 상태를 설정 된 상태로 유지 하는 것은 매우 중요 합니다.However, it is very important that view state remains enabled for GridViews that support editing or deleting (the default behavior). GridView s EnableViewState 속성을 false로 설정 하면 편집 및 삭제 동작이 단일 사용자에 대해 제대로 작동 하지만 데이터를 동시에 삭제 하는 동시 사용자가 의도 하지 않은 레코드를 실수로 삭제 하거나 편집할 가능성이 있습니다.If you set the GridView s EnableViewState property to false, the editing and deleting behavior will work fine for a single user, but if there are concurrent users deleting data, there exists the possibility that these concurrent users may accidentally delete or edit records that they didn't intend. 자세한 내용은 내 블로그 항목, 경고: 편집 및/또는 삭제를 지원 하 고 보기 상태를 사용 하지 않도록 설정 된 ASP.NET 2.0 gridviews/DetailsView/FormViews의 동시성 문제를 참조 하세요.See my blog entry, WARNING: Concurrency Issue with ASP.NET 2.0 GridViews/DetailsView/FormViews that Support Editing and/or Deleting and Whose View State is Disabled, for more information.

이 경고는 DetailsViews 및 FormViews에도 적용 됩니다.This same warning also applies to DetailsViews and FormViews.

GridView에 삭제 기능을 추가 하려면 해당 스마트 태그로 이동 하 여 삭제 사용 확인란을 선택 하면 됩니다.To add deleting capabilities to a GridView, simply go to its smart tag and check the Enable Deleting checkbox.

삭제 사용 확인란을 선택 합니다.

그림 10: 삭제 사용 확인란 선택Figure 10: Check the Enable Deleting Checkbox

스마트 태그에서 삭제 사용 확인란을 선택 하면 CommandField가 GridView에 추가 됩니다.Checking the Enable Deleting checkbox from the smart tag adds a CommandField to the GridView. CommandField는 레코드 선택, 레코드 편집 및 레코드 삭제 작업 중 하나 이상을 수행 하는 단추를 사용 하 여 GridView의 열을 렌더링 합니다.The CommandField renders a column in the GridView with buttons for performing one or more of the following tasks: selecting a record, editing a record, and deleting a record. 이전에는 세부 정보 DetailView 자습서와 함께 선택 가능한 마스터 GridView를 사용 하 여 마스터/세부 정보에서 레코드를 선택 하는 동작의 commandfield를 살펴보았습니다.We previously saw the CommandField in action with selecting records in the Master/Detail Using a Selectable Master GridView with a Details DetailView tutorial.

CommandField에는 CommandField에 표시 되는 일련의 단추를 나타내는 다양 한 ShowXButton 속성이 포함 되어 있습니다.The CommandField contains a number of ShowXButton properties that indicate what series of buttons are displayed in the CommandField. 삭제 사용 확인란을 선택 하 여 ShowDeleteButton 속성이 True 인 CommandField를 GridView의 Columns 컬렉션에 추가 했습니다.By checking the Enable Deleting checkbox a CommandField whose ShowDeleteButton property is True has been added to the GridView's Columns collection.

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1"> <Columns> <asp:CommandField ShowDeleteButton="True" /> ... BoundFields removed for brevity ... </Columns> </asp:GridView>

이 시점에서 GridView에 지원 삭제를 추가 하는 작업이 완료 되었습니다.At this point, believe it or not, we're done with adding deleting support to the GridView! 그림 11에 나와 있는 것 처럼 브라우저를 통해이 페이지를 방문 하는 경우 삭제 단추 열이 있습니다.As Figure 11 shows, when visiting this page through a browser a column of Delete buttons is present.

CommandField 삭제 단추의 열을 추가 합니다.The CommandField Adds a Column of Delete Buttons

그림 11: Commandfield는 Delete 단추의 열을 추가 합니다 (전체 크기 이미지를 보려면 클릭).Figure 11: The CommandField Adds a Column of Delete Buttons (Click to view full-size image)

처음부터 직접이 자습서를 작성 한 경우에는이 페이지를 테스트할 때 삭제 단추를 클릭 하면 예외가 발생 합니다.If you've been building this tutorial from the ground up on your own, when testing this page clicking the Delete button will raise an exception. 이러한 예외가 발생 한 이유와 해결 방법에 대 한 자세한 내용은 계속 읽어 보세요.Continue reading to learn as to why these exceptions were raised and how to fix them.

Note

이 자습서와 함께 제공 된 다운로드를 사용 하 여 수행 하는 경우에는 이러한 문제가 이미 고려 되었습니다.If you're following along using the download accompanying this tutorial, these problems have already been accounted for. 그러나 발생할 수 있는 문제를 식별 하 고 적절 한 해결 방법을 확인 하려면 아래에 나열 된 세부 정보를 읽어보시기 바랍니다.However, I encourage you to read through the details listed below to help identify problems that may arise and suitable workarounds.

제품을 삭제 하려고 할 때 "objectdatasource ' ObjectDataSource1 ' 매개 변수를 포함 하는 제네릭이 아닌 ' DeleteProduct ' 메서드를 찾을 수 없습니다 (productid, original_productid,"). objectdatasource에서 OldValuesParameterFormatString 속성을 제거 하지 않을 수 있습니다.If, when attempting to delete a product, you get an exception whose message is similar to "ObjectDataSource 'ObjectDataSource1' could not find a non-generic method 'DeleteProduct' that has parameters: productID, original_ProductID," you likely forgot to remove the OldValuesParameterFormatString property from the ObjectDataSource. 지정 된 OldValuesParameterFormatString 속성을 사용 하 여 ObjectDataSource는 productIDoriginal_ProductID 입력 매개 변수를 DeleteProduct 메서드에 전달 하려고 시도 합니다.With the OldValuesParameterFormatString property specified, the ObjectDataSource attempts to pass in both productID and original_ProductID input parameters to the DeleteProduct method. 그러나 DeleteProduct는 단일 입력 매개 변수만 허용 하므로 예외입니다.DeleteProduct, however, only accepts a single input parameter, hence the exception. OldValuesParameterFormatString 속성을 제거 하거나 {0}로 설정 하면 ObjectDataSource에서 원래 입력 매개 변수를 전달 하려고 시도 하지 않습니다.Removing the OldValuesParameterFormatString property (or setting it to {0}) instructs the ObjectDataSource to not attempt to pass in the original input parameter.

OldValuesParameterFormatString 속성이 제거 되었는지 확인 Ensure That the OldValuesParameterFormatString Property Has Been Cleared Out

그림 12: OldValuesParameterFormatString 속성의 선택이 취소 되었는지 확인 (전체 크기 이미지를 보려면 클릭)Figure 12: Ensure That the OldValuesParameterFormatString Property Has Been Cleared Out (Click to view full-size image)

OldValuesParameterFormatString 속성을 제거한 경우에도 "delete 문이 참조 제약 조건과 충돌 합니다. ' FK_Order_Details_Products '와 충돌합니다." 라는 메시지가 포함 된 제품을 삭제 하려고 할 때 예외가 발생 합니다. Northwind 데이터베이스에는 Order Details 테이블과 Products 테이블 간의 foreign key 제약 조건이 포함 되어 있습니다. 즉, Order Details 테이블에 하나 이상의 레코드가 있는 경우 시스템에서 제품을 삭제할 수 없습니다.Even if you had removed the OldValuesParameterFormatString property, you still will get an exception when trying to delete a product with the message: "The DELETE statement conflicted with the REFERENCE constraint 'FK_Order_Details_Products'." The Northwind database contains a foreign key constraint between the Order Details and Products table, meaning that a product cannot be deleted from the system if there are one or more records for it in the Order Details table. Northwind 데이터베이스의 모든 제품은 Order Details에 하나 이상의 레코드를 포함 하므로 먼저 제품의 연결 된 주문 정보 레코드를 삭제할 때까지 제품을 삭제할 수 없습니다.Since every product in the Northwind database has at least one record in Order Details, we cannot delete any products until we first delete the product's associated order details records.

Foreign Key 제약 조건을 제품 삭제 금지A Foreign Key Constraint Prohibits the Deletion of Products

그림 13: Foreign Key 제약 조건에서 제품 삭제를 금지 (전체 크기 이미지를 보려면 클릭)Figure 13: A Foreign Key Constraint Prohibits the Deletion of Products (Click to view full-size image)

이 자습서에서는 Order Details 테이블의 모든 레코드를 삭제 해 보겠습니다.For our tutorial, let's just delete all of the records from the Order Details table. 실제 응용 프로그램에서 다음 중 하나를 수행 해야 합니다.In a real-world application we'd need to either:

  • 주문 세부 정보를 관리 하는 다른 화면이 있습니다.Have another screen to manage order details information
  • 지정 된 제품의 주문 정보를 삭제 하는 논리를 포함 하도록 DeleteProduct 메서드를 확대 합니다.Augment the DeleteProduct method to include logic to delete the specified product's order details
  • 지정 된 제품의 주문 정보 삭제를 포함 하기 위해 TableAdapter에서 사용 하는 SQL 쿼리를 수정 합니다.Modify the SQL query used by the TableAdapter to include deletion of the specified product's order details

Foreign key 제약 조건을 회피 하기 위해 Order Details 테이블에서 모든 레코드를 삭제 하겠습니다.Let's just delete all of the records from the Order Details table to circumvent the foreign key constraint. Visual Studio에서 서버 탐색기로 이동 하 여 NORTHWND.MDF 노드를 마우스 오른쪽 단추로 클릭 하 고 새 쿼리를 선택 합니다.Go to the Server Explorer in Visual Studio, right-click on the NORTHWND.MDF node, and choose New Query. 그런 다음 쿼리 창에서 다음 SQL 문을 실행 합니다. DELETE FROM [Order Details]Then, in the query window, run the following SQL statement: DELETE FROM [Order Details]

Order Details 테이블의 모든 레코드를 삭제 Delete All Records from the Order Details Table

그림 14: Order Details 테이블에서 모든 레코드 삭제 (전체 크기 이미지를 보려면 클릭)Figure 14: Delete All Records from the Order Details Table (Click to view full-size image)

Order Details 테이블을 지운 후 삭제 단추를 클릭 하면 오류가 발생 하지 않고 제품이 삭제 됩니다.After clearing out the Order Details table clicking on the Delete button will delete the product without error. 삭제 단추를 클릭 해도 제품이 삭제 되지 않는 경우 GridView의 DataKeyNames 속성이 기본 키 필드 (ProductID)로 설정 되어 있는지 확인 합니다.If clicking on the Delete button does not delete the product, check to ensure that the GridView's DataKeyNames property is set to the primary key field (ProductID).

Note

삭제 단추를 클릭 하면 포스트백이 ensues 레코드는 삭제 됩니다.When clicking on the Delete button a postback ensues and the record is deleted. 실수로 잘못 된 행의 삭제 단추를 클릭할 수 있으므로이는 위험할 수 있습니다.This can be dangerous since it is easy to accidentally click on the wrong row's Delete button. 이후 자습서에서는 레코드를 삭제할 때 클라이언트 쪽 확인을 추가 하는 방법을 알아봅니다.In a future tutorial we'll see how to add a client-side confirmation when deleting a record.

GridView를 사용 하 여 데이터 편집Editing Data with the GridView

또한 삭제와 더불어 GridView 컨트롤은 기본 제공 행 수준 편집 지원도 제공 합니다.Along with deleting, the GridView control also provides built-in row-level editing support. 편집을 지원 하도록 GridView를 구성 하면 편집 단추의 열이 추가 됩니다.Configuring a GridView to support editing adds a column of Edit buttons. 최종 사용자의 관점에서 행의 편집 단추를 클릭 하면 해당 행이 편집 가능 하 고, 기존 값을 포함 하는 입력란으로 셀을 바꾸고, 편집 단추를 업데이트 및 취소 단추로 바꿀 수 있습니다.From the end user's perspective, clicking a row's Edit button causes that row to become editable, turning the cells into textboxes containing the existing values and replacing the Edit button with Update and Cancel buttons. 원하는 변경을 수행한 후 최종 사용자는 업데이트 단추를 클릭 하 여 변경 내용을 커밋하거나 취소 단추를 클릭 하 여 해당 변경 내용을 취소할 수 있습니다.After making their desired changes, the end user can click the Update button to commit the changes or the Cancel button to discard them. 두 경우 모두 업데이트 또는 취소를 클릭 하면 GridView가 사전 편집 상태로 돌아갑니다.In either case, after clicking Update or Cancel the GridView returns to its pre-editing state.

페이지 개발자의 관점에서 최종 사용자가 특정 행에 대 한 편집 단추를 클릭 하면 다시 게시 ensues 및 GridView는 다음 단계를 수행 합니다.From our perspective as the page developer, when the end user clicks the Edit button for a particular row, a postback ensues and the GridView performs the following steps:

  1. GridView의 EditItemIndex 속성이 편집 단추를 클릭 한 행의 인덱스에 할당 됩니다.The GridView's EditItemIndex property is assigned to the index of the row whose Edit button was clicked
  2. GridView는 Select() 메서드를 호출 하 여 ObjectDataSource에 다시 바인딩합니다.The GridView rebinds itself to the ObjectDataSource by invoking its Select() method
  3. EditItemIndex 일치 하는 행 인덱스는 "편집 모드"로 렌더링 됩니다.The row index that matches the EditItemIndex is rendered in "edit mode." 이 모드에서 편집 단추는 업데이트 및 취소 단추로 바뀌고 ReadOnly 속성이 False (기본값) 인 BoundFields는 Text 속성이 데이터 필드 값에 할당 된 TextBox 웹 컨트롤로 렌더링 됩니다.In this mode, the Edit button is replaced by Update and Cancel buttons and BoundFields whose ReadOnly properties are False (the default) are rendered as TextBox Web controls whose Text properties are assigned to the data fields' values.

이 시점에서 태그는 브라우저에 반환 되어 최종 사용자가 행의 데이터를 변경할 수 있도록 합니다.At this point the markup is returned to the browser, allowing the end user to make any changes to the row's data. 사용자가 업데이트 단추를 클릭 하면 다시 게시가 발생 하 고 GridView에서 다음 단계를 수행 합니다.When the user clicks the Update button, a postback occurs and the GridView performs the following steps:

  1. ObjectDataSource의 UpdateParameters 값에는 최종 사용자가 입력 한 값이 GridView의 편집 인터페이스에 할당 됩니다.The ObjectDataSource's UpdateParameters value(s) are assigned the values entered by the end user into the GridView's editing interface
  2. ObjectDataSource의 Update() 메서드가 호출 되어 지정 된 레코드를 업데이트 합니다.The ObjectDataSource's Update() method is invoked, updating the specified record
  3. GridView는 Select() 메서드를 호출 하 여 ObjectDataSource에 다시 바인딩합니다.The GridView rebinds itself to the ObjectDataSource by invoking its Select() method

1 단계에서 UpdateParameters에 할당 된 기본 키 값은 DataKeyNames 속성에 지정 된 값에서 가져오며, 기본 키가 아닌 값은 편집 된 행에 대 한 TextBox 웹 컨트롤의 텍스트에서 제공 됩니다.The primary key values assigned to the UpdateParameters in Step 1 come from the values specified in the DataKeyNames property, whereas the non-primary key values come from the text in the TextBox Web controls for the edited row. 삭제와 마찬가지로 GridView의 DataKeyNames 속성을 올바르게 설정 하는 것이 중요 합니다.As with deleting, it is vital that a GridView's DataKeyNames property be correctly set. 누락 된 경우 UpdateParameters 기본 키 값에 1 단계에서 Nothing 값이 할당 됩니다. 그러면 2 단계에서 업데이트 된 레코드를 발생 시 키 지 않습니다.If it's missing, the UpdateParameters primary key value will be assigned a value of Nothing in Step 1, which in turn will not result in any updated records in Step 2.

GridView의 스마트 태그에서 편집 사용 확인란을 선택 하면 편집 기능을 활성화할 수 있습니다.Editing functionality can be activated by simply checking the Enable Editing checkbox in the GridView's smart tag.

편집 사용 확인란을 선택 합니다.

그림 15: 편집 사용 확인란 선택Figure 15: Check the Enable Editing Checkbox

편집 사용 확인란을 선택 하면 CommandField (필요한 경우)가 추가 되 고 ShowEditButton 속성이 True로 설정 됩니다.Checking the Enable Editing checkbox will add a CommandField (if needed) and set its ShowEditButton property to True. 앞서 살펴본 것 처럼 CommandField에는 CommandField에 표시 되는 일련의 단추를 나타내는 다양 한 ShowXButton 속성이 포함 되어 있습니다.As we saw earlier, the CommandField contains a number of ShowXButton properties that indicate what series of buttons are displayed in the CommandField. 편집 사용 확인란을 선택 하면 ShowEditButton 속성이 기존 CommandField에 추가 됩니다.Checking the Enable Editing checkbox adds the ShowEditButton property to the existing CommandField:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1"> <Columns> <asp:CommandField ShowDeleteButton="True" ShowEditButton="True" /> ... BoundFields removed for brevity ... </Columns> </asp:GridView>

기초적인 편집 지원을 추가 하는 것이 전부입니다.That's all there is to adding rudimentary editing support. Figure16에 표시 된 것 처럼 편집 인터페이스는 ReadOnly 속성이 False (기본값)로 설정 되어 있는 각 BoundField를 조잡 합니다.As Figure16 shows, the editing interface is rather crude each BoundField whose ReadOnly property is set to False (the default) is rendered as a TextBox. 여기에는 다른 테이블에 대 한 키인 CategoryIDSupplierID같은 필드가 포함 됩니다.This includes fields like CategoryID and SupplierID, which are keys to other tables.

Chai s 편집 단추를 클릭 하면 행이 편집 모드에서 표시 됩니다. Clicking Chai s Edit Button Displays the Row in Edit Mode

그림 16: Chai s 편집 단추를 클릭 하면 행이 편집 모드로 표시 됩니다 (전체 크기 이미지를 보려면 클릭).Figure 16: Clicking Chai s Edit Button Displays the Row in Edit Mode (Click to view full-size image)

사용자가 외래 키 값을 직접 편집 하도록 요청 하는 것 외에도, 편집 인터페이스의 인터페이스는 다음과 같은 측면에서 부족 합니다.In addition to asking users to edit foreign key values directly, the editing interface's interface is lacking in the following ways:

  • 사용자가 데이터베이스에 없는 CategoryID 또는 SupplierID 입력 하면 UPDATE 외래 키 제약 조건을 위반 하 여 예외가 발생 됩니다.If the user enters a CategoryID or SupplierID that does not exist in the database, the UPDATE will violate a foreign key constraint, causing an exception to be raised.
  • 편집 인터페이스에는 유효성 검사가 포함 되지 않습니다.The editing interface doesn't include any validation. 필요한 값 (예: ProductName)을 제공 하지 않거나 숫자 값이 필요한 문자열 값을 입력 합니다 (예: "너무 많이 입력!").If you don't provide a required value (such as ProductName), or enter a string value where a numeric value is expected (such as entering "Too much!" UnitPrice 텍스트 상자)에서 예외가 throw 됩니다.into the UnitPrice textbox), an exception will be thrown. 이후 자습서에서는 편집 사용자 인터페이스에 유효성 검사 컨트롤을 추가 하는 방법을 살펴봅니다.A future tutorial will examine how to add validation controls to the editing user interface.
  • 현재 읽기 전용이 아닌 모든 제품 필드는 GridView에 포함 되어야 합니다.Currently, all product fields that are not read-only must be included in the GridView. GridView에서 필드를 제거 하는 경우 UnitPrice, 예를 들어, 데이터를 업데이트 하는 경우 GridView에서 UnitPrice UpdateParameters 값을 설정 하지 않으므로 데이터베이스 레코드의 UnitPrice NULL 값으로 변경 됩니다.If we were to remove a field from the GridView, say UnitPrice, when updating the data the GridView would not set the UnitPrice UpdateParameters value, which would change the database record's UnitPrice to a NULL value. 마찬가지로, ProductName와 같은 필수 필드가 GridView에서 제거 되는 경우 "열 ' ProductName ' 은 위에서 언급 한 null을 허용 하지 않습니다." 라는 예외를 사용 하 여 업데이트가 실패 합니다.Similarly, if a required field, such as ProductName, is removed from the GridView, the update will fail with the same "Column 'ProductName' does not allow nulls" exception mentioned above.
  • 편집 인터페이스 서식 지정은 원하는 대로 유지 됩니다.The editing interface formatting leaves a lot to be desired. UnitPrice는 네 개의 소수점 점으로 표시 됩니다.The UnitPrice is shown with four decimal points. 이상적으로 CategoryIDSupplierID 값에는 시스템의 범주와 공급자를 나열 하는 Dropdownlist 포함 되어 있습니다.Ideally the CategoryID and SupplierID values would contain DropDownLists that list the categories and suppliers in the system.

이는 현재와 함께 사용 해야 하는 모든 단점 이지만 이후 자습서에서 해결 될 예정입니다.These are all shortcomings that we'll have to live with for now, but will be addressed in future tutorials.

DetailsView을 사용 하 여 데이터 삽입, 편집 및 삭제Inserting, Editing, and Deleting Data with the DetailsView

이전 자습서에서 살펴본 것 처럼 DetailsView 컨트롤은 한 번에 하나의 레코드를 표시 하 고 GridView와 같이 현재 표시 된 레코드를 편집 하 고 삭제할 수 있습니다.As we've seen in earlier tutorials, the DetailsView control displays one record at a time and, like the GridView, allows for editing and deleting of the currently displayed record. DetailsView에서 항목을 편집 하 고 삭제 하는 최종 사용자 경험과 ASP.NET 쪽의 워크플로는 모두 GridView와 동일 합니다.Both the end user's experience with editing and deleting items from a DetailsView and the workflow from the ASP.NET side is identical to that of the GridView. 이때 DetailsView은 GridView와는 달리 기본 제공 삽입 지원도 제공 합니다.Where the DetailsView differs from the GridView is that it also provides built-in inserting support.

GridView의 데이터 수정 기능을 보여 주려면 먼저 기존 GridView 위의 Basics.aspx 페이지에 DetailsView을 추가 하 고 DetailsView의 스마트 태그를 통해 기존 ObjectDataSource에 바인딩합니다.To demonstrate the data modification capabilities of the GridView, start by adding a DetailsView to the Basics.aspx page above the existing GridView and bind it to the existing ObjectDataSource through the DetailsView's smart tag. 그런 다음 DetailsView의 HeightWidth 속성을 지우고, 스마트 태그에서 페이징 사용 옵션을 선택 합니다.Next, clear out the DetailsView's Height and Width properties, and check the Enable Paging option from the smart tag. 편집, 삽입 및 삭제 지원을 사용 하려면 스마트 태그에서 편집 사용, 삽입 사용 및 삭제 확인란을 선택 하면 됩니다.To enable editing, inserting, and deleting support, simply check the Enable Editing, Enable Inserting, and Enable Deleting checkboxes in the smart tag.

편집, 삽입 및 삭제를 지원 하도록 DetailsView 구성

그림 17: 편집, 삽입 및 삭제를 지원 하도록 DetailsView 구성Figure 17: Configure the DetailsView to Support Editing, Inserting, and Deleting

GridView와 마찬가지로 편집, 삽입 또는 삭제 지원을 추가 하면 다음 선언적 구문에서 볼 수 있는 것 처럼 DetailsView에 CommandField가 추가 됩니다.As with the GridView, adding editing, inserting, or deleting support adds a CommandField to the DetailsView, as the following declarative syntax shows:

<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1" AllowPaging="True"> <Fields> <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False" ReadOnly="True" SortExpression="ProductID" /> <asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" /> <asp:BoundField DataField="SupplierID" HeaderText="SupplierID" SortExpression="SupplierID" /> <asp:BoundField DataField="CategoryID" HeaderText="CategoryID" SortExpression="CategoryID" /> <asp:BoundField DataField="QuantityPerUnit" HeaderText="QuantityPerUnit" SortExpression="QuantityPerUnit" /> <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" /> <asp:BoundField DataField="UnitsInStock" HeaderText="UnitsInStock" SortExpression="UnitsInStock" /> <asp:BoundField DataField="UnitsOnOrder" HeaderText="UnitsOnOrder" SortExpression="UnitsOnOrder" /> <asp:BoundField DataField="ReorderLevel" HeaderText="ReorderLevel" SortExpression="ReorderLevel" /> <asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued" SortExpression="Discontinued" /> <asp:BoundField DataField="CategoryName" HeaderText="CategoryName" ReadOnly="True" SortExpression="CategoryName" /> <asp:BoundField DataField="SupplierName" HeaderText="SupplierName" ReadOnly="True" SortExpression="SupplierName" /> <asp:CommandField ShowDeleteButton="True" ShowEditButton="True" ShowInsertButton="True" /> </Fields> </asp:DetailsView>

DetailsView의 경우 CommandField는 기본적으로 Columns 컬렉션의 끝에 표시 됩니다.Note that for the DetailsView the CommandField appears at the end of the Columns collection by default. DetailsView의 필드는 행으로 렌더링 되므로 CommandField는 DetailsView의 아래쪽에 삽입, 편집 및 삭제 단추가 포함 된 행으로 표시 됩니다.Since the DetailsView's fields are rendered as rows, the CommandField appears as a row with Insert, Edit, and Delete buttons at the bottom of the DetailsView.

편집, 삽입 및 삭제를 지원 하도록 DetailsView 구성 Configure the DetailsView to Support Editing, Inserting, and Deleting

그림 18: 편집, 삽입 및 삭제를 지원 하도록 DetailsView 구성 (전체 크기 이미지를 보려면 클릭)Figure 18: Configure the DetailsView to Support Editing, Inserting, and Deleting (Click to view full-size image)

삭제 단추를 클릭 하면 GridView와 동일한 이벤트 시퀀스를 시작 합니다. 다시 게시 합니다. 그런 다음 DataKeyNames 값을 기준으로 ObjectDataSource의 DeleteParameters를 채우는 DetailsView 및는 해당 ObjectDataSource의 Delete() 메서드를 호출 합니다 .이 메서드는 실제로 데이터베이스에서 제품을 제거 합니다.Clicking on the Delete button starts the same sequence of events as with the GridView: a postback; followed by the DetailsView populating its ObjectDataSource's DeleteParameters based on the DataKeyNames values; and completed with a call its ObjectDataSource's Delete() method, which actually removes the product from the database. 또한 DetailsView의 편집은 GridView와 동일한 방식으로 작동 합니다.Editing in the DetailsView also works in a fashion identical to that of the GridView.

삽입을 위해 최종 사용자에 게 클릭 하면 DetailsView을 "삽입 모드"로 렌더링 하는 새 단추가 표시 됩니다.For inserting, the end user is presented with a New button that, when clicked, renders the DetailsView in "insert mode." "삽입 모드"를 사용 하면 새 단추가 삽입 및 취소 단추로 바뀌고 InsertVisible 속성이 True (기본값)로 설정 되어 있는 BoundFields 표시 됩니다.With "insert mode" the New button is replaced by Insert and Cancel buttons and only those BoundFields whose InsertVisible property is set to True (the default) are displayed. ProductID와 같이 자동 증분 필드로 식별 되는 이러한 데이터 필드에는 스마트 태그를 통해 DetailsView를 데이터 소스에 바인딩할 때 Insertvisible 속성이 False로 설정 됩니다.Those data fields identified as auto-increment fields, such as ProductID, have their InsertVisible property set to False when binding the DetailsView to the data source through the smart tag.

스마트 태그를 통해 DetailsView에 데이터 소스를 바인딩하는 경우 Visual Studio는 자동 증분 필드에 대해서만 False InsertVisible 속성을 설정 합니다.When binding a data source to a DetailsView through the smart tag, Visual Studio sets the InsertVisible property to False only for auto-increment fields. CategoryNameSupplierName와 같은 읽기 전용 필드는 InsertVisible 속성이 명시적으로 False로 설정 되지 않는 한 "삽입 모드" 사용자 인터페이스에 표시 됩니다.Read-only fields, like CategoryName and SupplierName, will be displayed in the "insert mode" user interface unless their InsertVisible property is explicitly set to False. 잠시 후에이 두 필드의 InsertVisible 속성을 DetailsView의 선언 구문이 나 스마트 태그의 편집 필드 링크를 통해 False로 설정 합니다.Take a moment to set these two fields' InsertVisible properties to False, either through the DetailsView's declarative syntax or through the Edit Fields link in the smart tag. 그림 19에서는 필드 편집 링크를 클릭 하 여 False InsertVisible 속성을 설정 하는 방법을 보여 줍니다.Figure 19 shows setting the InsertVisible properties to False by clicking on the Edit Fields link.

Northwind Traders는 이제 Acme Tea을 제공 합니다.Northwind Traders Now Offers Acme Tea

그림 19: 이제 Tea (전체 크기 이미지를 보려면 클릭)를 제공 하는 Northwind Traders에서 Acme를 제공 합니다.Figure 19: Northwind Traders Now Offers Acme Tea (Click to view full-size image)

InsertVisible 속성을 설정한 후 브라우저에서 Basics.aspx 페이지를 보고 새로 만들기 단추를 클릭 합니다.After setting the InsertVisible properties, view the Basics.aspx page in a browser and click the New button. 그림 20은 제품 라인에 새 음료, Acme Tea를 추가 하는 경우 DetailsView을 보여 줍니다.Figure 20 shows the DetailsView when adding a new beverage, Acme Tea, to our product line.

Northwind Traders는 이제 Acme Tea을 제공 합니다.Northwind Traders Now Offers Acme Tea

그림 20: 이제는 이제 Acme Tea (전체 크기 이미지를 보려면 클릭)를 제공 합니다.Figure 20: Northwind Traders Now Offers Acme Tea (Click to view full-size image)

Acme Tea에 대 한 세부 정보를 입력 하 고 삽입 단추를 클릭 하면 다시 게시 ensues 및 새 레코드가 Products 데이터베이스 테이블에 추가 됩니다.After entering the details for Acme Tea and clicking the Insert button, a postback ensues and the new record is added to the Products database table. 이 DetailsView은 데이터베이스 테이블에 있는 제품을 순서 대로 나열 하므로 새 제품을 확인 하기 위해 마지막 제품으로 페이지를 표시 해야 합니다.Since this DetailsView lists the products in order with which they exist in the database table, we must page to the last product in order to see the new product.

Acme Tea에 대 한 세부 정보Details for Acme Tea

그림 21: Acme Tea에 대 한 세부 정보 (전체 크기 이미지를 보려면 클릭)Figure 21: Details for Acme Tea (Click to view full-size image)

Note

DetailsView의 Currentmode 속성 은 표시 되는 인터페이스를 나타내며 Edit, Insert또는 ReadOnly값 중 하나일 수 있습니다.The DetailsView's CurrentMode property indicates the interface being displayed and can be one of the following values: Edit, Insert, or ReadOnly. Defaultmode 속성 은 편집 또는 삽입이 완료 된 후 detailsview에서 반환 하는 모드를 나타내며, 편집 또는 삽입 모드에서 영구적으로 detailsview을 표시 하는 데 유용 합니다.The DefaultMode property indicates the mode the DetailsView returns to after an edit or insert has been completed and is useful for displaying a DetailsView that is permanently in edit or insert mode.

DetailsView의 삽입 및 편집 기능을 가리키고 클릭 하면 GridView와 동일한 제한 사항이 적용 됩니다. 사용자는 텍스트 상자를 통해 기존 CategoryID를 입력 하 고 값을 SupplierID 해야 합니다. 인터페이스에 유효성 검사 논리가 부족 합니다. NULL 값을 허용 하지 않거나 데이터베이스 수준에서 기본값이 지정 되지 않은 모든 product 필드는 삽입 인터페이스 등에 포함 되어야 합니다.The point and click inserting and editing capabilities of the DetailsView suffer from the same limitations as the GridView: the user must enter existing CategoryID and SupplierID values through a textbox; the interface lacks any validation logic; all product fields that do not allow NULL values or don't have a default value specified at the database level must be included in the inserting interface, and so on.

이후 문서에서 GridView의 편집 인터페이스를 확장 하 고 개선 하기 위해 검토할 기술은 DetailsView 컨트롤의 편집 및 삽입 인터페이스에도 적용 될 수 있습니다.The techniques we will examine for extending and enhancing the GridView's editing interface in future articles can be applied to the DetailsView control's editing and inserting interfaces as well.

보다 유연한 데이터 수정 사용자 인터페이스에 대해 FormView 사용Using the FormView for a More Flexible Data Modification User Interface

FormView는 데이터 삽입, 편집 및 삭제에 대 한 기본 제공 지원을 제공 하지만 필드 대신 템플릿을 사용 하기 때문에 GridView 및 DetailsView 컨트롤에서 데이터를 제공 하는 데 사용 하는 BoundFields 또는 CommandField를 추가할 장소가 없습니다. 수정 인터페이스입니다.The FormView offers built-in support for inserting, editing, and deleting data, but because it uses templates instead of fields there's no place to add the BoundFields or the CommandField used by the GridView and DetailsView controls to provide the data modification interface. 대신이 인터페이스는 새 항목을 추가 하거나 새로 만들기, 편집, 삭제, 삽입, 업데이트 및 취소 단추와 함께 기존 항목을 편집할 때 사용자 입력을 수집 하는 웹 컨트롤을 적절 한 템플릿에 수동으로 추가 해야 합니다.Instead, this interface the Web controls for collecting user input when adding a new item or editing an existing one along with the New, Edit, Delete, Insert, Update, and Cancel buttons must be added manually to the appropriate templates. 다행히 Visual Studio는 해당 스마트 태그의 드롭다운 목록을 통해 FormView를 데이터 소스에 바인딩할 때 필요한 인터페이스를 자동으로 만듭니다.Fortunately, Visual Studio will automatically create the needed interface when binding the FormView to a data source through the drop-down list in its smart tag.

이러한 기술을 설명 하려면 먼저 Basics.aspx 페이지에 FormView를 추가 하 고 FormView의 스마트 태그에서 이미 만든 ObjectDataSource에 바인딩합니다.To illustrate these techniques, start by adding a FormView to the Basics.aspx page and, from the FormView's smart tag, bind it to the ObjectDataSource already created. 이렇게 하면 새로 만들기, 편집, 삭제, 삽입, 업데이트 및 취소 단추에 대 한 사용자의 입력 및 단추 웹 컨트롤을 수집 하기 위해 TextBox 웹 컨트롤을 사용 하 여 FormView에 대 한 EditItemTemplate, InsertItemTemplateItemTemplate 생성 됩니다.This will generate an EditItemTemplate, InsertItemTemplate, and ItemTemplate for the FormView with TextBox Web controls for collecting the user's input and Button Web controls for the New, Edit, Delete, Insert, Update, and Cancel buttons. 또한 FormView의 DataKeyNames 속성은 ObjectDataSource에서 반환 하는 개체의 기본 키 필드 (ProductID)로 설정 됩니다.Additionally, the FormView's DataKeyNames property is set to the primary key field (ProductID) of the object returned by the ObjectDataSource. 마지막으로 FormView의 스마트 태그에서 페이징 사용 옵션을 선택 합니다.Lastly, check the Enable Paging option in the FormView's smart tag.

다음은 FormView를 ObjectDataSource에 바인딩한 후 FormView의 ItemTemplate에 대 한 선언적 태그를 보여 줍니다.The following shows the declarative markup for the FormView's ItemTemplate after the FormView has been bound to the ObjectDataSource. 기본적으로 각 부울 값 필드 (Discontinued)는 사용 하지 않도록 설정 된 CheckBox 웹 컨트롤의 Checked 속성에 바인딩되기 때문에 각 부울 값이 아닌 product 필드는 Label 웹 컨트롤의 Text 속성에 바인딩됩니다.By default, each non-Boolean value product field is bound to the Text property of a Label Web control while each Boolean value field (Discontinued) is bound to the Checked property of a disabled CheckBox Web control. 클릭 하면 새, 편집 및 삭제 단추가 특정 FormView 동작을 트리거하기 위해 CommandName 값을 각각 New, EditDelete로 설정 해야 합니다.In order for the New, Edit, and Delete buttons to trigger certain FormView behavior when clicked, it is imperative that their CommandName values be set to New, Edit, and Delete, respectively.

<asp:FormView ID="FormView1" runat="server" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1" AllowPaging="True"> <EditItemTemplate> ... </EditItemTemplate> <InsertItemTemplate> ... </InsertItemTemplate> <ItemTemplate> ProductID: <asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label><br /> ProductName: <asp:Label ID="ProductNameLabel" runat="server" Text='<%# Bind("ProductName") %>'> </asp:Label><br /> SupplierID: <asp:Label ID="SupplierIDLabel" runat="server" Text='<%# Bind("SupplierID") %>'> </asp:Label><br /> CategoryID: <asp:Label ID="CategoryIDLabel" runat="server" Text='<%# Bind("CategoryID") %>'> </asp:Label><br /> QuantityPerUnit: <asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Bind("QuantityPerUnit") %>'> </asp:Label><br /> UnitPrice: <asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Bind("UnitPrice") %>'></asp:Label><br /> UnitsInStock: <asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Bind("UnitsInStock") %>'> </asp:Label><br /> UnitsOnOrder: <asp:Label ID="UnitsOnOrderLabel" runat="server" Text='<%# Bind("UnitsOnOrder") %>'> </asp:Label><br /> ReorderLevel: <asp:Label ID="ReorderLevelLabel" runat="server" Text='<%# Bind("ReorderLevel") %>'> </asp:Label><br /> Discontinued: <asp:CheckBox ID="DiscontinuedCheckBox" runat="server" Checked='<%# Bind("Discontinued") %>' Enabled="false" /><br /> CategoryName: <asp:Label ID="CategoryNameLabel" runat="server" Text='<%# Bind("CategoryName") %>'> </asp:Label><br /> SupplierName: <asp:Label ID="SupplierNameLabel" runat="server" Text='<%# Bind("SupplierName") %>'> </asp:Label><br /> <asp:LinkButton ID="EditButton" runat="server" CausesValidation="False" CommandName="Edit" Text="Edit"> </asp:LinkButton> <asp:LinkButton ID="DeleteButton" runat="server" CausesValidation="False" CommandName="Delete" Text="Delete"> </asp:LinkButton> <asp:LinkButton ID="NewButton" runat="server" CausesValidation="False" CommandName="New" Text="New"> </asp:LinkButton> </ItemTemplate> </asp:FormView>

그림 22는 브라우저를 통해 볼 때 FormView의 ItemTemplate을 보여 줍니다.Figure 22 shows the FormView's ItemTemplate when viewed through a browser. 각 product 필드는 맨 아래에 새로 만들기, 편집 및 삭제 단추가 나열 됩니다.Each product field is listed with the New, Edit, and Delete buttons at the bottom.

기본적 FormView ItemTemplate 새, 편집 및 삭제 단추와 함께 각 Product 필드를 나열 합니다.The Defaut FormView ItemTemplate Lists Each Product Field Along with New, Edit, and Delete Buttons

그림 22: 기본적 FormView ItemTemplate 새, 편집 및 삭제 단추와 함께 각 제품 필드를 나열 합니다 (전체 크기 이미지를 보려면 클릭).Figure 22: The Defaut FormView ItemTemplate Lists Each Product Field Along with New, Edit, and Delete Buttons (Click to view full-size image)

GridView 및 DetailsView과 마찬가지로 Delete 단추를 클릭 하거나 CommandName 속성이 삭제로 설정 된 단추, LinkButton 또는 ImageButton을 클릭 하면 포스트백이 발생 하 고, FormView의 DataKeyNames 값을 기준으로 ObjectDataSource의 DeleteParameters를 채우고 ObjectDataSource의 Delete() 메서드를 호출 합니다.Like with the GridView and DetailsView, clicking the Delete button or any Button, LinkButton, or ImageButton whose CommandName property is set to Delete causes a postback, populates the ObjectDataSource's DeleteParameters based on the FormView's DataKeyNames value, and invokes the ObjectDataSource's Delete() method.

편집 단추를 클릭 하 여 ensues를 클릭 하 고 데이터를 EditItemTemplate에 다시 바인딩할 경우이는 편집 인터페이스를 렌더링 하는 역할을 담당 합니다.When the Edit button is clicked a postback ensues and the data is rebound to the EditItemTemplate, which is responsible for rendering the editing interface. 이 인터페이스는 업데이트 및 취소 단추와 함께 데이터를 편집 하는 웹 컨트롤을 포함 합니다.This interface includes the Web controls for editing data along with the Update and Cancel buttons. Visual Studio에서 생성 되는 기본 EditItemTemplate에는 자동 증분 필드 (ProductID)에 대 한 레이블, 부울이 아닌 값 필드에 대 한 입력란 및 각 부울 값 필드에 대 한 확인란이 포함 되어 있습니다.The default EditItemTemplate generated by Visual Studio contains a Label for any auto-increment fields (ProductID), a TextBox for each non-Boolean value field, and a CheckBox for each Boolean value field. 이 동작은 GridView 및 DetailsView 컨트롤에서 자동 생성 된 BoundFields 매우 유사 합니다.This behavior is very similar to the auto-generated BoundFields in the GridView and DetailsView controls.

Note

FormView의 EditItemTemplate 자동 생성에 대 한 한 가지 작은 문제는 CategoryNameSupplierName와 같이 읽기 전용인 필드에 대해 TextBox 웹 컨트롤을 렌더링 한다는 것입니다.One small issue with the FormView's auto-generation of the EditItemTemplate is that it renders TextBox Web controls for those fields that are read-only, such as CategoryName and SupplierName. 잠시 후에이를 고려 하는 방법을 살펴보겠습니다.We'll see how to account for this shortly.

EditItemTemplate의 TextBox 컨트롤에는 양방향 데이터 바인딩을사용 하 여 해당 데이터 필드의 값에 바인딩된 Text 속성이 있습니다.The TextBox controls in the EditItemTemplate have their Text property bound to the value of their corresponding data field using two-way databinding. <%# Bind("dataField") %>로 표시 되는 양방향 데이터 바인딩은 데이터를 템플릿에 바인딩할 때와 레코드 삽입 또는 편집을 위해 ObjectDataSource의 매개 변수를 채울 때 모두 데이터 바인딩을 수행 합니다.Two-way databinding, denoted by <%# Bind("dataField") %>, performs databinding both when binding data to the template and when populating the ObjectDataSource's parameters for inserting or editing records. 즉, 사용자가 ItemTemplate에서 편집 단추를 클릭 하면 Bind() 메서드는 지정 된 데이터 필드 값을 반환 합니다.That is, when the user clicks the Edit button from the ItemTemplate, the Bind() method returns the specified data field value. 사용자가 변경 하 고 업데이트를 클릭 하면 Bind()를 사용 하 여 지정한 데이터 필드에 해당 하는 다시 게시 된 값이 ObjectDataSource의 UpdateParameters에 적용 됩니다.After the user makes their changes and clicks Update, the values posted back that correspond to the data fields specified using Bind() are applied to the ObjectDataSource's UpdateParameters. 또는 <%# Eval("dataField") %>으로 표시 되는 단방향 데이터 바인딩은 데이터를 템플릿에 바인딩할 때만 데이터 필드 값을 검색 하 고 다시 게시할 때 사용자가 입력 한 값을 데이터 소스의 매개 변수에 반환 하지 않습니다.Alternatively, one-way databinding, denoted by <%# Eval("dataField") %>, only retrieves the data field values when binding data to the template and does not return the user-entered values to the data source's parameters on postback.

다음 선언 태그는 FormView의 EditItemTemplate을 보여 줍니다.The following declarative markup shows the FormView's EditItemTemplate. Bind() 메서드는 데이터 바인딩 구문에서 사용 되며, 업데이트 및 취소 단추 웹 컨트롤의 CommandName 속성을 적절 하 게 설정 합니다.Note that the Bind() method is used in the databinding syntax here and that the Update and Cancel Button Web controls have their CommandName properties set accordingly.

<asp:FormView ID="FormView1" runat="server" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1" AllowPaging="True"> <EditItemTemplate> ProductID: <asp:Label ID="ProductIDLabel1" runat="server" Text="<%# Eval("ProductID") %>"></asp:Label><br /> ProductName: <asp:TextBox ID="ProductNameTextBox" runat="server" Text="<%# Bind("ProductName") %>"> </asp:TextBox><br /> SupplierID: <asp:TextBox ID="SupplierIDTextBox" runat="server" Text="<%# Bind("SupplierID") %>"> </asp:TextBox><br /> CategoryID: <asp:TextBox ID="CategoryIDTextBox" runat="server" Text="<%# Bind("CategoryID") %>"> </asp:TextBox><br /> QuantityPerUnit: <asp:TextBox ID="QuantityPerUnitTextBox" runat="server" Text="<%# Bind("QuantityPerUnit") %>"> </asp:TextBox><br /> UnitPrice: <asp:TextBox ID="UnitPriceTextBox" runat="server" Text="<%# Bind("UnitPrice") %>"> </asp:TextBox><br /> UnitsInStock: <asp:TextBox ID="UnitsInStockTextBox" runat="server" Text="<%# Bind("UnitsInStock") %>"> </asp:TextBox><br /> UnitsOnOrder: <asp:TextBox ID="UnitsOnOrderTextBox" runat="server" Text="<%# Bind("UnitsOnOrder") %>"> </asp:TextBox><br /> ReorderLevel: <asp:TextBox ID="ReorderLevelTextBox" runat="server" Text="<%# Bind("ReorderLevel") %>"> </asp:TextBox><br /> Discontinued: <asp:CheckBox ID="DiscontinuedCheckBox" runat="server" Checked="<%# Bind("Discontinued") %>" /><br /> CategoryName: <asp:TextBox ID="CategoryNameTextBox" runat="server" Text="<%# Bind("CategoryName") %>"> </asp:TextBox><br /> SupplierName: <asp:TextBox ID="SupplierNameTextBox" runat="server" Text="<%# Bind("SupplierName") %>"> </asp:TextBox><br /> <asp:LinkButton ID="UpdateButton" runat="server" CausesValidation="True" CommandName="Update" Text="Update"> </asp:LinkButton> <asp:LinkButton ID="UpdateCancelButton" runat="server" CausesValidation="False" CommandName="Cancel" Text="Cancel"> </asp:LinkButton> </EditItemTemplate> <InsertItemTemplate> ... </InsertItemTemplate> <ItemTemplate> ... </ItemTemplate> </asp:FormView>

현재 EditItemTemplate에서는이를 사용 하려고 할 때 예외가 throw 됩니다.Our EditItemTemplate, at this point, will cause an exception to be thrown if we attempt to use it. 문제는 CategoryNameSupplierName 필드가 EditItemTemplate에서 TextBox 웹 컨트롤로 렌더링 된다는 것입니다.The problem is that the CategoryName and SupplierName fields are rendered as TextBox Web controls in the EditItemTemplate. 이러한 텍스트 상자를 레이블로 변경 하거나 완전히 제거 해야 합니다.We either need to change these TextBoxes to Labels or remove them altogether. 단순히 EditItemTemplate에서 완전히 삭제 하겠습니다.Let's simply delete them entirely from the EditItemTemplate.

그림 23은 Chai에 대해 편집 단추를 클릭 한 후 브라우저의 FormView를 보여 줍니다.Figure 23 shows the FormView in a browser after the Edit button has been clicked for Chai. EditItemTemplate에서 제거 했으므로 ItemTemplate에 표시 된 SupplierNameCategoryName 필드가 더 이상 존재 하지 않습니다.Note that the SupplierName and CategoryName fields shown in the ItemTemplate are no longer present, as we just removed them from the EditItemTemplate. 업데이트 단추를 클릭 하면 FormView는 GridView 및 DetailsView 컨트롤과 동일한 일련의 단계를 진행 합니다.When the Update button is clicked the FormView proceeds through the same sequence of steps as the GridView and DetailsView controls.

기본적으로 EditItemTemplate는 각 편집 가능한 제품 필드를 TextBox 또는 CheckBox로 표시 합니다.By Default the EditItemTemplate Shows Each Editable Product Field as a TextBox or CheckBox

그림 23: 기본적으로 EditItemTemplate는 각각의 편집 가능한 제품 필드를 TextBox 또는 CheckBox로 표시 합니다 (전체 크기 이미지를 보려면 클릭).Figure 23: By Default the EditItemTemplate Shows Each Editable Product Field as a TextBox or CheckBox (Click to view full-size image)

삽입 단추를 클릭 하면 다시 게시 ensues ItemTemplate FormView가 클릭 됩니다.When the Insert button is clicked the FormView's ItemTemplate a postback ensues. 그러나 새 레코드를 추가 하는 중이기 때문에 데이터는 FormView에 바인딩되지 않습니다.However, no data is bound to the FormView because a new record is being added. InsertItemTemplate 인터페이스에는 삽입 및 취소 단추와 함께 새 레코드를 추가 하는 웹 컨트롤이 포함 되어 있습니다.The InsertItemTemplate interface includes the Web controls for adding a new record along with the Insert and Cancel buttons. Visual Studio에서 생성 되는 기본 InsertItemTemplate에는 각 비 부울 값 필드에 대 한 텍스트 상자와 각 부울 값 필드에 대 한 CheckBox가 자동 생성 된 EditItemTemplate인터페이스와 유사 하 게 포함 됩니다.The default InsertItemTemplate generated by Visual Studio contains a TextBox for each non-Boolean value field and a CheckBox for each Boolean value field, similar to the auto-generated EditItemTemplate's interface. TextBox 컨트롤에는 양방향 데이터 바인딩을 사용 하 여 해당 데이터 필드의 값에 바인딩된 Text 속성이 있습니다.The TextBox controls have their Text property bound to the value of their corresponding data field using two-way databinding.

다음 선언 태그는 FormView의 InsertItemTemplate을 보여 줍니다.The following declarative markup shows the FormView's InsertItemTemplate. Bind() 메서드는 데이터 바인딩 구문에서 사용 되며 삽입 및 취소 단추 웹 컨트롤의 CommandName 속성을 적절 하 게 설정 합니다.Note that the Bind() method is used in the databinding syntax here and that the Insert and Cancel Button Web controls have their CommandName properties set accordingly.

<asp:FormView ID="FormView1" runat="server" DataKeyNames="ProductID" DataSourceID="ObjectDataSource1" AllowPaging="True"> <EditItemTemplate> ... </EditItemTemplate> <InsertItemTemplate> ProductName: <asp:TextBox ID="ProductNameTextBox" runat="server" Text="<%# Bind("ProductName") %>"> </asp:TextBox><br /> SupplierID: <asp:TextBox ID="SupplierIDTextBox" runat="server" Text="<%# Bind("SupplierID") %>"> </asp:TextBox><br /> CategoryID: <asp:TextBox ID="CategoryIDTextBox" runat="server" Text="<%# Bind("CategoryID") %>"> </asp:TextBox><br /> QuantityPerUnit: <asp:TextBox ID="QuantityPerUnitTextBox" runat="server" Text="<%# Bind("QuantityPerUnit") %>"> </asp:TextBox><br /> UnitPrice: <asp:TextBox ID="UnitPriceTextBox" runat="server" Text="<%# Bind("UnitPrice") %>"> </asp:TextBox><br /> UnitsInStock: <asp:TextBox ID="UnitsInStockTextBox" runat="server" Text="<%# Bind("UnitsInStock") %>"> </asp:TextBox><br /> UnitsOnOrder: <asp:TextBox ID="UnitsOnOrderTextBox" runat="server" Text="<%# Bind("UnitsOnOrder") %>"> </asp:TextBox><br /> ReorderLevel: <asp:TextBox ID="ReorderLevelTextBox" runat="server" Text="<%# Bind("ReorderLevel") %>"> </asp:TextBox><br /> Discontinued: <asp:CheckBox ID="DiscontinuedCheckBox" runat="server" Checked="<%# Bind("Discontinued") %>" /><br /> CategoryName: <asp:TextBox ID="CategoryNameTextBox" runat="server" Text="<%# Bind("CategoryName") %>"> </asp:TextBox><br /> SupplierName: <asp:TextBox ID="SupplierNameTextBox" runat="server" Text="<%# Bind("SupplierName") %>"> </asp:TextBox><br /> <asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True" CommandName="Insert" Text="Insert"> </asp:LinkButton> <asp:LinkButton ID="InsertCancelButton" runat="server" CausesValidation="False" CommandName="Cancel" Text="Cancel"> </asp:LinkButton> </InsertItemTemplate> <ItemTemplate> ... </ItemTemplate> </asp:FormView>

InsertItemTemplate의 FormView의 자동 생성을 사용 하는 미묘한 있습니다.There's a subtlety with the FormView's auto-generation of the InsertItemTemplate. 특히 TextBox 웹 컨트롤은 CategoryNameSupplierName와 같이 읽기 전용인 필드에 대해서도 생성 됩니다.Specifically, the TextBox Web controls are created even for those fields that are read-only, such as CategoryName and SupplierName. EditItemTemplate와 마찬가지로 InsertItemTemplate에서 이러한 텍스트 상자를 제거 해야 합니다.Like with the EditItemTemplate, we need to remove these TextBoxes from the InsertItemTemplate.

그림 24에서는 새 제품, Acme 커피를 추가할 때 브라우저의 FormView를 보여 줍니다.Figure 24 shows the FormView in a browser when adding a new product, Acme Coffee. 방금 제거 했으므로 ItemTemplate에 표시 된 SupplierNameCategoryName 필드가 더 이상 존재 하지 않습니다.Note that the SupplierName and CategoryName fields shown in the ItemTemplate are no longer present, as we just removed them. 삽입 단추를 클릭 하면 FormView는 DetailsView 컨트롤과 동일한 일련의 단계를 진행 하 여 Products 테이블에 새 레코드를 추가 합니다.When the Insert button is clicked the FormView proceeds through the same sequence of steps as the DetailsView control, adding a new record to the Products table. 그림 25에서는 FormView가 삽입 된 후에 FormView의 Acme 제품 정보를 보여 줍니다.Figure 25 shows Acme Coffee product's details in the FormView after it has been inserted.

InsertItemTemplate는 FormView의 삽입 인터페이스를 지시 합니다. The InsertItemTemplate Dictates the FormView's Inserting Interface

그림 24: FormView의 삽입 인터페이스를 결정 하는 InsertItemTemplate (전체 크기 이미지를 보려면 클릭)Figure 24: The InsertItemTemplate Dictates the FormView's Inserting Interface (Click to view full-size image)

새 제품에 대 한 세부 정보 (Acme 커피) FormView에 표시 됩니다.The Details for New Product, Acme Coffee, are Displayed in the FormView

그림 25: 새 제품에 대 한 세부 정보 (Acme 커피)는 FormView에 표시 됩니다 (전체 크기 이미지를 보려면 클릭).Figure 25: The Details for New Product, Acme Coffee, are Displayed in the FormView (Click to view full-size image)

FormView를 사용 하면 읽기 전용, 편집 및 삽입 인터페이스를 세 개의 개별 템플릿으로 분리 하 여 DetailsView 및 GridView 보다 이러한 인터페이스를 보다 세밀 하 게 제어할 수 있습니다.By separating out the read-only, editing, and inserting interfaces into three separate templates, the FormView allows for a finer degree of control over these interfaces than the DetailsView and GridView.

Note

DetailsView과 마찬가지로 FormView의 CurrentMode 속성은 표시 되는 인터페이스를 나타내며, 해당 DefaultMode 속성은 편집 또는 삽입이 완료 된 후 FormView에서 반환 하는 모드를 나타냅니다.Like the DetailsView, the FormView's CurrentMode property indicates the interface being displayed and its DefaultMode property indicates the mode the FormView returns to after an edit or insert has been completed.

요약Summary

이 자습서에서는 GridView, DetailsView 및 FormView를 사용 하 여 데이터를 삽입, 편집 및 삭제 하는 기본 사항을 살펴보았습니다.In this tutorial we examined the basics of inserting, editing, and deleting data using the GridView, DetailsView, and FormView. 이러한 세 가지 컨트롤은 데이터 웹 컨트롤과 ObjectDataSource 덕분에 ASP.NET 페이지에 코드를 한 줄도 작성 하지 않고도 활용할 수 있는 기본 제공 데이터 수정 기능을 제공 합니다.All three of these controls provide some level of built-in data modification capabilities that can be utilized without writing a single line of code in the ASP.NET page thanks to the data Web controls and the ObjectDataSource. 그러나 단순 지점 및 클릭 기술은 매우 frail 및 naive 데이터 수정 사용자 인터페이스를 렌더링 합니다.However, the simple point and click techniques render a fairly frail and naïve data modification user interface. 유효성 검사를 제공 하 고, 프로그래밍 방식 값을 삽입 하 고, 예외를 정상적으로 처리 하 고, 사용자 인터페이스를 사용자 지정 하기 위해 다음 몇 가지 자습서에서 설명 하는 기술 일련을 사용 해야 합니다.To provide validation, inject programmatic values, gracefully handle exceptions, customize the user interface, and so on, we'll need to rely on a bevy of techniques that will be discussed over the next several tutorials.

행복 한 프로그래밍Happy Programming!

저자 정보About the Author

Scott Mitchell(7 개의 ASP/ASP. NET books 및 4GuysFromRolla.com창립자)은 1998부터 Microsoft 웹 기술을 사용 하 여 작업 했습니다.Scott Mitchell, author of seven ASP/ASP.NET books and founder of 4GuysFromRolla.com, has been working with Microsoft Web technologies since 1998. Scott은 독립 컨설턴트, 강사 및 기록기로 작동 합니다.Scott works as an independent consultant, trainer, and writer. 최신 책은 24 시간 이내에 ASP.NET 2.0을 sams teach yourself것입니다.His latest book is Sams Teach Yourself ASP.NET 2.0 in 24 Hours. mitchell@4GuysFromRolla.com에 도달할 수 있습니다 .He can be reached at mitchell@4GuysFromRolla.com. 또는 블로그를 통해 http://ScottOnWriting.NET에서 찾을 수 있습니다.or via his blog, which can be found at http://ScottOnWriting.NET.