GridView 컨트롤

지난번에 SqlDataSource을 사용하여 DB데이터를 확보했다면 이제 그 데이터를 표현하여야한다.

GridView 컨트롤은 데이터를 테이블 형식으로 렌더링하고 열 정렬, 데이터 페이징, 단일 레코드 편집 또는 삭제 기능을 제공하는 등 다른 데이터 바인딩 컨트롤보다 더 많은 기능을 가지고 있는 매우 유용한 컨트롤이다. 
ASP.NET 1.x 에서 사용되던 DataGrid컨트롤을 대체하는 새로운 컨트롤인데 개선된 점은 다음과 같다.

향상된 디자인 타임기능(더욱 편리해진 컨트롤 인터페이스)
향상된 데이터 소스 바인딩 기능
열 형식 추가 지원
PageTemplate을 통한 사용자 지정 페이저지원
확장된 이벤트 모델

상당히 난감하지만 위와같이 분명히 무엇인가 개선되고 좋아진것이라 한다. 사실 이전버전과의 호환성을 위해 DataGrid을 사용하긴 하지만 MS는 GridView을 사용토록 권장하고 있다.

GridView 컨트롤를 드래그하면 다음과 같은 코드가 자동 생성된다.(직접 코딩해도된다)
        
         <asp:GridView ID="GridView1" runat="server">
         </asp:GridView>

디자인뷰에서 GridView 컨트롤의 자동서식을 사용하여 디자인도 바꾸고, 데이터베이스랑 연동까지 자동으로 시켜줄수있다(완전 편해) 하지만 자세한 내용을 알기 위하여 직접코딩해보는것이 좋다.( 단 디자인 정도는 자동서식을 사용해도 문제될게 없다.)
디자인타입을 '전문가'를 선택하니 아래처럼 코드가 많이 변했다.

<asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333"
                 GridLines="None">
                 <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                 <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                 <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                 <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                 <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                 <EditRowStyle BackColor="#999999" />
                 <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
</asp:GridView>

상당히 길어졌지만 VS가 자동으로 생성시켜주는 코드이기때문에 크게 신경쓸 필욘없다. 다만 알고있으면 쫌더 이뿌게 만들수는 있다.

중요한건 GridView 컨트롤안의 DataSourceID의 값을 만들어둔 SqlDataSource와 연결시키는 것이다.
예를들어..

이제 불러올 DB의 각 컬럼값들의 위치등을 확보하기 위하여 <Columns> 태그 안에 DB의 각 컬럼들과의 관계를 정하는 명령을 해야한다.
<asp:GridView  DataSourceID="SqlDataSource1" >

<Columns>
    <asp:BoundField DataField="title" HeaderText="제 목" />
    <asp:BoundField DataField="writer" HeaderText="작성자">
    <asp:BoundField DataField="transdate" HeaderText="작성일"
             DataFormatString="{0:yyyy-MM-dd}">
     <asp:BoundField DataField="readcount" HeaderText="조회수">
</Columns>

위의 문장은 <Columns>태그 안의 <asp:BoundField>열 형식을 사용하여 바인딩하는 코드이다.
기본적인 게시판리스트에서 보게되는 목록을 기준으로 한 컬럼값들이다.
쉽게 표현하고 싶은 ...보고싶은 데이터값으로 테이블을 하나 만든다고 생각하면 될것도 같다.
BoundField열 형식의 주요 속성을 정리하면 다음과 같다.

DataField : 개체에 바인딩할 열의 이름을 가져오거나 설정한다.
HeaderText : 열의 머리글에 표시되는 텍스트를 가져오거나 설정한다.
ReadOnly : 편집모드에서 열값을 수정할수 있는지 여부를 결정한다. TRUE는 읽기전용
SortExpression : 데이터를 정렬하는데 사용되는 정렬 식을 가져오거나 설정한다.
Visible : 열의 보임 여부를 나타내는 값을 가져오거나 설정한다.

설정을 끝내고 결과물을 보니 다음과 같은 느낌이다.

위는 Taeyo님의 강좌를 기준으로 한것이며, <HeaderStyle> 태그를 사용하여 넓이와 디자인등을 살짝 바꾼 결과물이다.