연습: XML 데이터를 표시할 웹 페이지 만들기

Visual Studio 2010

업데이트: 2007년 11월

데이터를 웹 응용 프로그램에서 XML 형식으로 종종 사용할 수 있습니다. 그러나 XML 데이터는 원래 계층적이며 GridView 또는 DropDownList 컨트롤과 같은 목록 기반 컨트롤에서 XML 데이터를 사용하려고 합니다. 이 연습에서는 표 형식의 데이터베이스 테이블에 포함되어 있는 경우처럼 XML 데이터로 작업하는 방법을 보여 줍니다.

이 연습을 통해 다음 작업을 수행하는 방법을 배웁니다.

  • 데이터 소스 컨트롤을 사용하여 XML 데이터를 읽고 list 컨트롤에서 사용 수 있게 만듭니다.

  • GridViewDataList 컨트롤을 XML 데이터에 바인딩합니다.

  • 논리적으로 연관된 XML 데이터를 표시하는 마스터-세부 페이지를 만듭니다.

  • .xml 파일에 변환을 적용하여 파일을 표 형식 데이터로 사용할 수 있게 만듭니다.

13ftcwy9.alert_note(ko-kr,VS.100).gif참고:

계층 형식의 XML로 작업할 수도 있습니다. 자세한 내용은 연습: TreeView 컨트롤에 계층 데이터 표시를 참조하십시오.

이 연습을 완료하려면 다음과 같은 요건을 갖추어야 합니다.

  • Microsoft Visual Web Developer

  • .NET Framework

이 연습에서는 사용자가 Visual Web Developer 사용 방법을 알고 있다고 가정합니다.

연습: Visual Web Developer에서 기본 웹 페이지 만들기의 단계에 따라 작업한 경우를 비롯하여 Visual Web Developer에서 웹 사이트를 이미 만든 경우 해당 웹 사이트를 사용하고 다음 단원으로 건너뛸 수 있습니다. 그렇지 않으면, 다음 단계를 따라 새 웹 사이트와 페이지를 만듭니다.

파일 시스템 웹 사이트를 만들려면

  1. Visual Web Developer를 엽니다.

  2. 파일 메뉴에서 새 웹 사이트를 가리킵니다.

    새 웹 사이트 대화 상자가 나타납니다.

  3. Visual Studio에 설치되어 있는 템플릿에서 ASP.NET 웹 사이트를 클릭합니다.

  4. 위치 상자에서 파일 시스템을 클릭한 다음 웹 사이트의 페이지를 보관할 폴더의 이름을 입력합니다.

    예를 들어, 폴더 이름 C:\WebSites\XMLWalkthrough를 입력합니다.

  5. 언어 목록에서 Visual Basic 또는 Visual C#과 같이 작업할 프로그래밍 언어를 클릭합니다.

    선택하는 프로그래밍 언어는 웹 사이트의 기본 언어가 되지만 페이지마다 따로 프로그래밍 언어를 설정할 수 있습니다.

  6. 확인을 클릭합니다.

    Visual Web Developer에서 해당 폴더와 Default.aspx라는 새 페이지를 만듭니다.

XML 데이터를 사용하려면 웹 사이트에 .xml 파일을 만듭니다.

.xml 파일을 만들려면

  1. 솔루션 탐색기에서 App_Data 폴더를 마우스 오른쪽 단추로 클릭한 다음 항목 추가를 클릭합니다.

    13ftcwy9.alert_note(ko-kr,VS.100).gif참고:

    App_Data 폴더에 추가된 .xml 파일에는 ASP.NET에서 런타임에 파일을 읽고 쓸 수 있도록 허용하는 올바른 권한이 지정됩니다. 또한 App_Data 폴더에 파일을 보관하면 App_Data 폴더가 검색 불가능 상태로 표시되므로 브라우저에서 해당 파일을 볼 수 없습니다.

  2. Visual Studio에 설치되어 있는 템플릿에서 XML 파일을 클릭합니다.

  3. 이름 상자에 Bookstore.xml을 입력합니다.

  4. 추가를 클릭합니다.

    XML 지시문만 포함된 새 .xml 파일이 만들어집니다.

  5. 다음 XML 데이터를 복사한 후 파일에 붙여넣어 파일의 기존 내용을 덮어씁니다.

    <?xml version="1.0" standalone="yes"?>
    <bookstore>
        <book ISBN="10-000000-001" 
            title="The Iliad and The Odyssey" 
            price="12.95">
        <comments>
            <userComment rating="4" 
                comment="Best translation I've read." />
            <userComment rating="2" 
                comment="I like other versions better." />
          </comments>
       </book>
       <book ISBN="10-000000-999" 
            title="Anthology of World Literature" 
            price="24.95">
       <comments>
          <userComment rating="3" 
              comment="Needs more modern literature." />
          <userComment rating="4" 
              comment="Excellent overview of world literature." />
       </comments>
       </book>
        <book ISBN="11-000000-002" 
            title="Computer Dictionary" 
            price="24.95" >
          <comments>
             <userComment rating="3" 
                 comment="A valuable resource." />
          </comments>
       </book>
        <book ISBN="11-000000-003" 
            title="Cooking on a Budget" 
            price="23.95" >
       <comments>
          <userComment rating="4" 
              comment="Delicious!" />
        </comments>
        </book>
        <book ISBN="11-000000-004" 
            title="Great Works of Art" 
            price="29.95" >
       </book>
    </bookstore>
    

    Bookstore.xml 파일에는 온라인 서점에서 사용할 수 있는 책에 대한 정보가 포함되어 있습니다. 이 .xml 파일에 대한 정보는 다음과 같습니다.

    • 요소의 속성 값은 모두 특성으로 표시됩니다.

    • 파일은 중첩된 구조를 포함합니다. 즉, 각 책은 해당 속성 값은 물론 하나 이상의 설명을 별도의 요소로 포함할 수 있습니다.

  6. Bookstore.xml 파일을 저장한 다음 닫습니다.

ASP.NET 웹 페이지의 컨트롤에서 데이터를 사용할 수 있게 만들려면 데이터 소스 컨트롤을 사용합니다.

.xml 파일에 대한 데이터 액세스를 구성하려면

  1. Default.aspx 파일을 열고 디자인 뷰로 전환합니다.

  2. 도구 상자데이터 그룹에서 XmlDataSource 컨트롤을 페이지로 끌어 옵니다.

  3. XmlDataSource작업 메뉴에서 데이터 소스 구성을 클릭합니다.

    데이터 소스 구성 - <DataSourceName> 대화 상자가 나타납니다.

  4. 데이터 파일 상자에 ~/App_Data/Bookstore.xml을 입력합니다.

  5. 확인을 클릭합니다.

XmlDataSource 컨트롤은 .xml 파일의 데이터를 페이지에 있는 컨트롤에서 사용할 수 있게 만듭니다. 데이터는 계층 형식 및 표 형식의 두 가지 형식으로 사용할 수 있습니다. XmlDataSource 컨트롤에 바인딩되는 컨트롤은 자신에 적합한 형식으로 데이터를 가져올 수 있습니다.

이 경우 Bookstore.xml 파일의 계층은 관계 해석에 유용합니다. 이 파일의 두 수준(책과 설명)을 연결된 두 개의 테이블로 간주할 수 있습니다.

이제 XML 데이터를 list 컨트롤에 표시할 수 있습니다. 먼저, XML 데이터 일부를 GridView 컨트롤에 표시합니다.

XML 데이터의 기본 표시를 위해 GridView 컨트롤을 사용하려면

  1. 도구 상자데이터 그룹에서 GridView 컨트롤을 페이지로 끌어 옵니다.

  2. GridView 작업 메뉴의 데이터 소스 선택 목록에서 XmlDataSource1을 클릭합니다.

  3. Ctrl+F5를 눌러 페이지를 실행합니다.

    페이지에 표 형식으로 XML 데이터가 표시됩니다.

GridView 컨트롤에 표시된 데이터는 XML 데이터가 해석되는 방식과 관련해서 다음과 같은 측면을 보여 줍니다.

  • XML 데이터가 데이터 레코드로 표현될 때 기본적으로 열은 ISBN과 같은 특성에서 만들어집니다.

  • 자식 요소는 연관된 개별 테이블의 일부로 취급됩니다. 이 예제에서 GridView 컨트롤은 파일의 comments 요소에 바인딩되지 않습니다.

이 연습의 첫 번째 부분에서는 .xml 파일에서 정보를 추출하기 위해 XmlDataSourceGridView 컨트롤의 기본 동작을 활용했습니다. 그러나 이 컨트롤은 XML 데이터의 일부만 표시합니다.

이 연습 부분에서는 또 다른 GridView 컨트롤을 추가한 후 마스터-세부 정보를 표시하는 데 사용합니다. 사용자는 첫 번째 GridView 컨트롤에서 개별 책을 선택할 수 있으며 두 번째 GridView 컨트롤은 해당 책에 대한 관련된 사용자 설명(있는 경우)을 표시합니다. 설명을 표시하려면 추출하려는 XML 데이터 파일의 수준을 지정할 수 있는 XPath 식을 사용합니다. 특정 책에 대한 설명만 표시하려고 하므로 사용자가 선택한 책에 따라 동적으로 XPath 식을 만듭니다.

먼저, 페이지에 또 다른 GridView 컨트롤을 추가한 후 사용자 설명을 표시하도록 GridView 컨트롤을 구성합니다.

GridView 컨트롤을 추가하여 사용자 설명을 표시하려면

  1. 디자인 뷰로 전환합니다.

  2. 도구 상자데이터 그룹에서 GridView 컨트롤을 페이지로 끌어 온 후 첫 번째 GridView 컨트롤 아래에 둡니다.

    GridView 작업 메뉴가 나타납니다.

  3. 데이터 소스 선택 상자에서 새 데이터 소스를 클릭합니다.

    데이터 소스 구성 마법사가 나타납니다.

  4. 데이터 소스로 XML 파일을 클릭합니다.

  5. 데이터 소스의 ID 지정 상자에서 기본 이름을 XmlDataSource2로 그대로 둡니다.

  6. 확인을 클릭합니다.

    데이터 소스 구성 대화 상자가 나타납니다.

  7. 데이터 파일 상자에 ~/App_Data/Bookstore.xml을 입력합니다.

    이 연습 앞부분에서 사용했던 것과 동일한 .xml 파일을 사용하지만 두 번째 GridView 컨트롤에서 이 파일에 대한 다른 정보를 추출합니다.

  8. XPath 식 상자에 다음 식을 입력합니다.

    /bookstore/book/comments/userComment

    나중에 코드에서 XPath 속성을 동적으로 변경합니다. 그러나 데이터 소스에 대한 XPath 식을 지금 정의하면 Visual Web Designer의 도구를 사용하여 컨트롤에 표시되는 정보를 확인할 수 있습니다.

  9. 확인을 클릭합니다.

    두 번째 GridView 컨트롤이 나타나며 등급과 사용자 설명을 샘플 데이터로 표시합니다.

  10. GridView2 컨트롤을 선택하고 속성에서 VisibleFalse로 설정합니다.

    두 번째 GridView 컨트롤은 첫 번째 GridView 컨트롤에서 책을 선택한 경우에만 나타납니다.

이제 사용자들이 책을 선택할 수 있게 첫 번째 GridView 컨트롤을 구성할 수 있습니다. 또한 사용자의 선택에 따라 XPath 식을 만든 후 XmlDataSource2 컨트롤에 할당하는 코드도 추가합니다. 마지막 결과로 두 번째 GridView 컨트롤은 선택된 책에 대한 사용자 설명을 표시합니다.

선택 사항에 대해 GridView 컨트롤을 구성하려면

  1. 디자인 뷰로 전환한 다음 첫 번째 GridView 컨트롤을 선택합니다.

  2. GridView 작업 메뉴에서 선택 사용을 선택합니다.

    텍스트 선택이 표시되는 링크 단추가 포함된 GridView 컨트롤에 새 열이 추가됩니다.

  3. 속성에서 DataKeyNamesISBN으로 설정합니다.

    속성 상자를 클릭하여 값을 선택할 수 있습니다.

    이렇게 하면 ISBN 속성을 XML 데이터에 들어 있는 각 요소에 대한 기본 키로 취급하도록 GridView 컨트롤이 구성됩니다.

  4. GridView 컨트롤을 클릭한 다음 속성 창의 도구 모음에서 이벤트를 선택합니다. 이렇게 하면 해당 컨트롤과 연관된 모든 이벤트가 표시됩니다.

  5. SelectedIndexChanged 이벤트에 대한 상자를 두 번 클릭합니다.

    이렇게 하면 코드 편집기로 전환되며 SelectedIndexChanged 이벤트에 대한 기본 처리기가 만들어집니다.

  6. 처리기에 다음의 강조 표시된 코드를 추가합니다.

    Protected Sub GridView1_SelectedIndexChanged(ByVal sender As Object, _
        ByVal e As System.EventArgs) _
        Handles GridView1.SelectedIndexChanged
            Dim currentIndex As Integer        currentIndex = GridView1.SelectedIndex        Dim isbn As String        isbn = CStr(GridView1.DataKeys(currentIndex).Value)        XmlDataSource2.XPath = _            String.Format( _            "/bookstore/book[@ISBN='{0}']/comments/userComment", _            isbn)        GridView2.Visible = true
    End Sub
    

    protected void GridView1_SelectedIndexChanged(Object sender, EventArgs e)
    {
        String isbn = (String)         GridView1.DataKeys[GridView1.SelectedIndex].Value;        XmlDataSource2.XPath =             String.Format(              "/bookstore/book[@ISBN='{0}']/comments/userComment",             isbn);        GridView2.Visible = true;
    }
    

    이 코드는 다음 작업을 수행합니다.

    • GridView 컨트롤의 SelectedIndex 속성을 사용하여 데이터 키 배열로 인덱싱한 후 선택된 행의 기본 키를 반환합니다. 앞에서 ISBN 번호를 포함하도록 DataKeyNames 속성을 설정했습니다.

    • 선택된 ISBN을 포함하는 XPath 식을 새로 만듭니다.

    • XmlDataSource2 컨트롤의 XPath 속성에 새로 만든 XPath 식을 할당합니다. XPath 속성에 새 XPath 식을 할당하면 XmlDataSource 컨트롤은 반환된 데이터를 다시 평가합니다. 그러면 GridView 컨트롤은 데이터에 다시 바인딩됩니다.

    • Visible 속성을 true로 설정하여 두 번째 GridView 컨트롤이 표시되도록 합니다. 두 번째 GridView 컨트롤을 만들 때 선언적으로 표시 유형을 false로 설정하여 사용자가 책을 선택할 때까지 해당 컨트롤이 나타나지 않도록 합니다.

이제 페이지를 테스트할 수 있습니다.

XPath 식을 사용하여 필터링을 테스트하려면

  1. Default.aspx 페이지를 표시한 후 Ctrl+F5를 눌러 페이지를 실행합니다.

    책에 대한 정보 표와 함께 페이지가 표시됩니다.

  2. 첫 번째 책 옆의 선택 링크를 클릭합니다.

    해당 책에 대한 설명이 또 다른 표에 표시됩니다.

  3. 마지막 책 옆의 선택 링크를 클릭합니다.

    이 책에 대한 설명이 없으므로 표시되지 않습니다.

데이터에 대해 사용자 지정 레이아웃을 만들려면 DataList 컨트롤을 사용할 수 있습니다. DataList 컨트롤에서 하나 이상의 템플릿을 정의할 수 있습니다. 각 템플릿은 원하는 어떠한 레이아웃으로도 정렬할 수 있는 정적 텍스트 및 컨트롤 조합을 포함합니다.

이 연습 부분에서는 DataList 컨트롤을 사용하여 이전에 GridView2 컨트롤을 사용하여 표시된 것과 동일한 정보를 표시합니다. 그러나 사용자 설명에 대한 사용자 지정 레이아웃을 만들 수 있습니다.

사용자 지정 레이아웃을 사용하여 XML 데이터를 표시하려면

  1. 디자인 뷰로 전환하고 GridView2 컨트롤을 클릭한 후 Delete 키를 눌러 페이지에서 해당 컨트롤을 제거합니다.

  2. 도구 상자데이터 그룹에서 DataList 컨트롤을 페이지로 끌어 옵니다.

  3. DataList 작업 메뉴의 데이터 소스 선택 목록에서 XmlDataSource2를 클릭합니다.

    DataList 컨트롤에 대해서도 GridView2 컨트롤에 대해 사용한 것과 동일한 데이터 소스를 사용합니다.

  4. 속성에서 Visiblefalse로 설정합니다.

  5. 스마트 태그가 나타나지 않으면 DataList 컨트롤을 마우스 오른쪽 단추로 클릭하고 스마트 태그 표시를 클릭합니다.

  6. DataList 작업 메뉴에서 템플릿 편집을 클릭한 다음 표시 상자에서 항목 템플릿을 클릭합니다.

    DataList 컨트롤은 항목 템플릿에 대한 편집 가능 영역을 나타냅니다. 이 템플릿에는 데이터 레코드의 등급 열 및 주석 열에 바인딩된 Label 컨트롤 및 정적 텍스트로 구성되는 기본 레이아웃이 포함됩니다. 이 연습 앞부분에서 XmlDataSource2 컨트롤에 대한 정적 XPath 식을 정의했으므로 DataList 컨트롤은 표시할 데이터의 구조를 유추할 수 있습니다.

  7. 편집 가능한 영역에서 첫 번째 캡션을 사용자 등급:으로 변경합니다.

  8. 캡션 설명설명:으로 변경합니다.

  9. DataList 컨트롤의 제목 표시줄을 마우스 오른쪽 단추로 클릭하고 템플릿 편집을 가리킨 다음 구분 기호 템플릿을 클릭합니다.

    편집 가능한 또 다른 영역이 DataList 컨트롤에 표시됩니다. 이 영역은 각 데이터 레코드 사이에 나타나는 요소의 레이아웃을 정의하기 위한 영역입니다.

  10. 도구 상자HTML 그룹에서 Horizontal Rule 컨트롤을 편집 가능한 영역으로 끌어 옵니다.

  11. DataList 컨트롤을 마우스 오른쪽 단추로 클릭한 다음 템플릿 편집 끝내기를 클릭합니다.

  12. 페이지를 마우스 오른쪽 단추로 클릭하고 코드 보기를 클릭하여 페이지에 대한 코드로 전환합니다.

  13. GridView1_SelectedIndexChanged 처리기에서 다음 줄을

    GridView2.Visible = True
    

    GridView2.Visible = true;
    

    아래와 같이 변경합니다

    DataList1.Visible = True
    

    DataList1.Visible = true;
    

이제 사용자 지정 레이아웃을 테스트할 수 있습니다.

사용자 지정 레이아웃을 테스트하려면

  1. Default.aspx 페이지를 표시한 후 Ctrl+F5를 눌러 페이지를 실행합니다.

    책에 대한 정보 표와 함께 페이지가 표시됩니다.

  2. 첫 번째 책 옆의 선택 링크를 클릭합니다.

    첫 번째 책에 대한 설명이 목록에 표시됩니다.

  3. 마지막 책 옆의 선택 링크를 클릭합니다.

    이 책에 대한 설명이 없으므로 표시되지 않습니다.

이 연습에서 사용했던 .xml 파일은 각 요소의 해당 속성이 특성으로 표현되도록 구성됩니다. 많은 경우에, 사용하는 .xml 파일은 다르게 구성됩니다. 예를 들어 .xml 파일의 값은 종종 내부 텍스트가 있는 요소로 만들어집니다.

속성 값이 특성이 아닌 형식으로 표현되는 .xml 파일이 있는 경우 XmlDataSource 컨트롤과 호환되도록 .xml 파일의 서식을 동적으로 다시 지정할 수 있는 변환 파일(.xslt)을 만들 수 있습니다.

이 연습 부분에서는 이전에 사용했던 Bookstore.xml 파일과 동일한 데이터를 포함하는 .xml 파일로 작업합니다. 그러나 해당 데이터는 Bookstore.xml 파일에 있을 때와는 다르게 구성되므로 변환을 사용하여 서식을 동적으로 다시 지정합니다.

이 단원을 시작하려면 또 다른 .xml 파일을 만듭니다.

두 번째 .xml 파일을 만들려면

  1. 솔루션 탐색기에서 App_Data 폴더를 마우스 오른쪽 단추로 클릭하고 항목 추가를 클릭합니다.

  2. Visual Studio에 설치되어 있는 템플릿에서 XML 파일을 클릭합니다.

  3. 이름 상자에 Bookstore2.xml을 입력합니다.

  4. 추가를 클릭합니다.

    XML 지시문만 포함된 새 .xml 파일이 만들어집니다.

  5. 다음 XML 데이터를 복사한 후 파일에 붙여넣어 파일의 기존 내용을 덮어씁니다.

    <?xml version="1.0" standalone="yes"?>
    <bookstore>
        <book ISBN="10-000000-001">
            <title>The Iliad and The Odyssey</title>
            <price>12.95</price>
            <comments>
                <userComment rating="4">
                    Best translation I've read.
                </userComment>
                <userComment rating="2">
                    I like other versions better.
                </userComment>
            </comments>
        </book>
        <book ISBN="10-000000-999">
            <title>Anthology of World Literature</title>
            <price>24.95</price>
            <comments>
                <userComment rating="3">
                    Needs more modern literature.
                </userComment>
                <userComment rating="4">
                    Excellent overview of world literature.
                </userComment>
            </comments>
        </book>
        <book ISBN="11-000000-002">
            <title>Computer Dictionary</title>
            <price>24.95</price>
            <comments>
                <userComment rating="3">
                   A valuable resource.
                </userComment>
            </comments>
        </book>
        <book ISBN="11-000000-003">
            <title>Cooking on a Budget</title>
            <price>23.95</price>
            <comments>
                <userComment rating="4">Delicious!</userComment>
            </comments>
        </book>
        <book ISBN="11-000000-004">
            <title>Great Works of Art</title>
            <price>29.95</price>
        </book>
    </bookstore>
    
  6. Bookstore2.xml 파일을 저장한 다음 닫습니다.

이제 Bookstore2.xml 파일의 데이터를 XmlDataSource 컨트롤에서 사용하는 특성 기반 형식으로 변환하는 변환이 필요합니다.

변환 파일을 만들려면

  1. 솔루션 탐색기에서 App_Data 폴더를 마우스 오른쪽 단추로 클릭하고 항목 추가를 클릭합니다.

  2. Visual Studio에 설치되어 있는 템플릿에서 텍스트 파일을 클릭합니다.

    변환 파일에 대한 템플릿은 없으므로 올바른 확장명을 지정하여 텍스트 파일로 만들 수 있습니다.

  3. 이름 상자에 Bookstore2.xsl을 입력합니다.

    13ftcwy9.alert_note(ko-kr,VS.100).gif참고:

    .xsl 확장명을 사용해야 합니다.

  4. 추가를 클릭합니다.

    빈 파일이 새로 만들어집니다.

  5. 다음 변환 코드를 복사한 후 파일에 붙여넣습니다.

    <?xml version="1.0"?>
    <xsl:stylesheet 
       version="1.0"
       xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:xsd="http://www.w3.org/2001/XMLSchema"
       xmlns:msxsl="urn:schemas-microsoft-com:xslt"
    >
       <xsl:strip-space elements="*"/>
       <xsl:output method="xml" 
           omit-xml-declaration="yes" 
           indent="yes" 
           standalone="yes" />
    
       <xsl:template match="/">
          <xsl:for-each select="bookstore">
             <xsl:element name="bookstore">
                <xsl:for-each select="book">
                   <xsl:element name="book">
                      <xsl:attribute name="ISBN">
                         <xsl:value-of select="@ISBN"/>
                      </xsl:attribute>
                      <xsl:attribute name="title">
                         <xsl:value-of select="title"/>
                      </xsl:attribute>
                      <xsl:attribute name="price">
                         <xsl:value-of select="price"/>
                      </xsl:attribute>
                   </xsl:element>
                </xsl:for-each>
             </xsl:element>
          </xsl:for-each>
       </xsl:template>
    </xsl:stylesheet>
    
  6. Bookstore2.xsl 파일을 저장한 다음 닫습니다.

이제부터 XML 데이터로 작업하는 과정은 XmlDataSource 컨트롤 구성 시 변환 파일을 지정할 수 있다는 점을 제외하고 이 연습 앞부분에서 수행했던 작업과 아주 비슷합니다. 이 연습 마지막 부분에서는 새 페이지를 만든 후 이 연습 첫 번째 부분 이후에 나오는 일부 단계를 반복합니다. 그러나 이번에는 Bookstore2.xml 파일의 데이터를 표시합니다.

.xml 파일에 대한 데이터 액세스를 구성하려면

  1. 솔루션 탐색기에서 웹 사이트의 이름을 마우스 오른쪽 단추로 클릭한 다음 항목 추가를 클릭합니다.

  2. Visual Studio에 설치되어 있는 템플릿에서 Web Form을 클릭합니다.

  3. 이름 상자에 Bookstore2.aspx를 입력합니다.

  4. 추가를 클릭합니다.

  5. 디자인 뷰로 전환합니다.

  6. 도구 상자데이터 그룹에서 XmlDataSource 컨트롤을 페이지로 끌어 옵니다.

  7. XmlDataSource작업 메뉴에서 데이터 소스 구성을 클릭합니다.

    데이터 소스 구성 대화 상자가나타납니다.

  8. 데이터 파일 상자에 ~/App_Data/Bookstore2.xml을 입력합니다.

  9. 변환 파일 상자에 ~/App_Data/Bookstore2.xsl을 입력합니다.

  10. 확인을 클릭합니다.

  11. 도구 상자데이터 그룹에서 GridView 컨트롤을 페이지로 끌어 옵니다.

  12. GridView 작업 메뉴의 데이터 소스 선택 목록에서 XmlDataSource1을 클릭합니다.

  13. Ctrl+F5를 눌러 페이지를 실행합니다.

    페이지에 표 형식으로 XML 데이터가 표시됩니다. 이번에는 기본 .xml 파일의 형식이 다르지만 데이터는 첫 번째 페이지의 경우와 동일하게 표 형식으로 표시됩니다.

이 연습에서는 XML 문서와 변환을 사용하는 기본 방법만을 배웠습니다. 실제 응용 프로그램에서는 XML 문서에 대해 보다 세부적으로 작업해야 하는 경우가 많습니다. 다음과 같은 작업을 통해 이 연습에서 다루지 않은 기능을 배울 수 있습니다.

  • 보다 정교한 변환 만들기. 이 연습에서는 변환을 사용하는 한 가지 방법만 배웠습니다. 그러나, XSL은 HTML 페이지를 만들기를 비롯하여 XML에서 다른 구조로의 거의 모든 종류의 변환을 정교하게 지원하는 강력한 언어입니다.

  • XML 문서 작성(단순히 XML 문서를 읽는 작업이 아님). Xml 컨트롤을 사용하면 ASP.NET 웹 페이지에 XML 파일의 내용을 쉽게 표시할 수 있습니다. 직접 XML 파일을 만들거나 수정할 수도 있습니다. 자세한 내용은 XML 문서 및 데이터를 참조하십시오. XML 파일에 쓰는 작업에 대한 예제를 보려면 연습: AdRotator 컨트롤을 사용하여 광고 표시 및 추적을 참조하십시오.

표시: