Write 페이지는 이미 만들었으니, 이번에는 글목록을 볼 수 있는 List 페이지를 만들어 보도록 하겠습니다. List 페이지에는 상당히 많은(?) 기능들이 포함되는데 예를 들면, 계층형 게시판일 경우 답변글의 목록과 한줄 덧글기능이 필요한 경우는 덧글의 갯수, 해당 글의 열람한 횟수, 24시간 이내의 글일경우는 새글표시와 페이징기능 그리고, content의 미리보기 기능등등... 상당히 복잡한 구조를 지니고 있죠? 또한, 업로드 기능이 있는 게시판이라면 그에 해당하는 자료(file)를 썸네일 형식으로 보여줄수도 있고 또는 파일이 있는지 없는지도 체크해줄 수 있습니다. 우선은 단순한 List 를 보여줄 수 있는 기능만 구현해 보도록 하고 나머지 부수적인 기능들은 하나씩 만들어 가보겠습니다.
이번에도 저장프로시저를 하나 작성합니다. 간단하게 리스트만을 뿌려줄 프로시저죠..ㅎㅎ;;
쿼리분석기를 실행한 후 use BoardAN2 입력하고 F5를 눌러줍니다. 그러면 BoardAN2가 선택이 되죠? 물론, 그냥 클릭한 후 선택하셔도 됩니다.
아래의 sql을 입력한 후 F5를 눌러 프로시저를 생성합니다.
CREATE PROC UP_SELECT_BOARD
AS
SET TRANSACTION ISOLATION LEVEL READ UNCOMMITTED
SET NOCOUNT ON
SELECT seq, thread, depth, id, nickName, force, title, upload, content, wdate FROM Board
ORDER BY thread DESC
GO
MSSQL EM을 실행시킨 후 저장 프로시저가 제대로 생성되었는지 확인합니다.
Visual Studio 2005를 실행한 후, 솔루션 탐색기에서 웹 사이트 선택 우클릭 > 새 항목 추가를 합니다.
"Web Form"을 선택한 후 List.aspx 이름을 입력합니다.
아래 그림처럼 GridView를 하나 던져 놓고, Write.aspx로 이동할 버튼도 하나 던져 놓습니다.
위의 그림에서 마우스 포인터가 위치한 곳( ▶ )을 클릭하여, 자동서식을 선택합니다. 저는 "기본"을 선택했습니다.
아래 그림처럼 GridView의 디자인이 변경되었죠? 이제는 데이터 소스를 선택해야 합니다.
아래 그림처럼 "<새 데이터 소스...>"를 선택합니다.
아래의 그림처럼 데이터베이스를 선택합니다.
미리 만들어 놓은 데이터베이스 연결 구성이 없기때문에 새로 만들어야 합니다.
Web.Config에 정의해 놓은 데이터베이스 연결문자열과 같습니다. 크게 어려울건 없죠..ㅎㅎ
그리고 중간쯤에 있는 "암호 저장"은 반드시 체크를 하셔야 합니다^^; 비록, 암호가 없다고 해도 말이죠; 그런 후 사용할 데이터베이스를 선택하면 되겠습니다.
연결 테스트가 성공했다는 메시지를 보여줍니다.
다시 연결 선택으로 돌아옵니다.
다음을 눌러서 진행합니다.
마찬가지로 다음을 눌러주면 되겠죠!
Select문 구성을 해줍니다. 아마도, 이전에 했던 예제에서는 직접 작성을 했었을겁니다.
이번에는 저장 프로시저를 만들었으니, 당연히 "사용자 지정 SQL 문 또는 저장 프로시저 지정"을 선택해야겠죠?
지금까지 저장프로시저를 Select와 Insert 두개를 만들었으니 둘다 지정해줍니다.
아직 Update와 Delete는 만들지 않았으니 그냥 남겨 두시면 됩니다. 나중에 다시 수정이 가능하니 조급하게 생각하진 않으셔도 되구요. 그냥 넘어가기 찜찜하시면 직접 만들어서 선택하셔도 됩니다.
나중에 제가한거랑 비교해봐도 될듯하거든요..ㅋ;;
Insert 프로시저도 지정해준 후 다음을 누릅니다.
쿼리 테스트를 해봅니다. 아래의 그림처럼 글 목록이 제대로 나오나요?
이제 마침을 눌러서 그리드 뷰를 확인해 봅니다.
ctrl + F5를 눌러서 실행을 시켜 보면 아래의 그림처럼 나올겁니다. 그러나 아직 무언가 부족하지 않습니까..ㅎㅎ? 약간 더 보기좋게(?) 수정을 해야 할거 같군요;;
아래 그림처럼 풀다운 메뉴를 펼친 후 "열 편집"을 선택합니다.
필드는 seq, id, nickName, force, title, wdate만을 남겨 놓고 나머지는 지워줍니다.
우측에 "BoundField 속성"에서 HeaderText를 적절하게 변경해 줍니다.
다시 빌드해보시면 아래 그림처럼 나오겠죠?
사실 이런식으로 바인딩을 하진 않습니다. 직접 바인딩 식을 작성해야 하지만, 이렇게 할수도 있으니 그냥 참고만 하시면 되겠네요;;
참고로 Html 부분 코드를 보시면
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="List.aspx.cs" Inherits="List" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>제목 없음</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
DataKeyNames="seq" DataSourceID="SqlDataSource1" ForeColor="#333333" GridLines="None">
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<Columns>
<asp:BoundField DataField="seq" HeaderText="No." InsertVisible="False" ReadOnly="True"
SortExpression="seq" />
<asp:BoundField DataField="id" HeaderText="아이디" SortExpression="id" />
<asp:BoundField DataField="nickName" HeaderText="별명" SortExpression="nickName" />
<asp:BoundField DataField="force" HeaderText="포스" SortExpression="force" />
<asp:BoundField DataField="title" HeaderText="제목" SortExpression="title" />
<asp:BoundField DataField="wdate" HeaderText="작성일" SortExpression="wdate" />
</Columns>
<RowStyle BackColor="#EFF3FB" />
<EditRowStyle BackColor="#2461BF" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:BoardAN2ConnectionString %>"
InsertCommand="UP_INSERT_BOARD" InsertCommandType="StoredProcedure" SelectCommand="UP_SELECT_BOARD"
SelectCommandType="StoredProcedure">
<InsertParameters>
<asp:Parameter Name="mainCategory" Type="String" />
<asp:Parameter Name="subCategory" Type="String" />
<asp:Parameter Name="id" Type="String" />
<asp:Parameter Name="nickName" Type="String" />
<asp:Parameter Name="force" Type="Int32" />
<asp:Parameter Name="title" Type="String" />
<asp:Parameter Name="upload" Type="String" />
<asp:Parameter Name="content" Type="String" />
<asp:Parameter Name="ip" Type="String" />
</InsertParameters>
</asp:SqlDataSource>
</div>
<asp:Button ID="Button1" runat="server" Text="새글쓰기" />
</form>
</body>
</html>
위의 붉은 글자부분이 중요합니다. 그리고 착각한게 있군요. Insert와 Delete, Update는 별도의 페이지 또는 앞으로 만들 Content.aspx 페이지에서 처리하게 될것입니다. 물론, List에서 Update와 Delete와 Insert를 모두 처리할수도 있지만, 그건 일반적인 게시판의 기능에서 약간(?) 벗어나기에...
혹시라도 시간이 되서 회원관리에 관한 리스트나 상품, 물류쪽 리스트나 아니면, 음! 현황 리스트를 만들일이 있다면 List에서 전부 처리를 해줘도 상관이 없습니다. 그건 나중문제니깐요^^;;
벌써 스크롤의 압박이 너무 심해서 List에 대한 내용은 다음에 또 하도록 하겠습니다-_-;;
'[ Web ] > ASP.NET' 카테고리의 다른 글
| asp.net에서 메세지 박스 사용요령(web) (0) | 2012.09.12 |
|---|---|
| ASP.NET 2.0 게시판 만들기 4 (List.aspx - 글목록 페이지) (0) | 2012.09.12 |
| ASP.NET 2.0 게시판 만들기 2 (Write.aspx - 글쓰기 페이지) (0) | 2012.09.12 |
| ASP.NET 2.0 게시판 만들기 1 (준비 단계) (0) | 2012.09.12 |
| ASP 게시판 만들기를 위한 셋팅 (IIS, ASP.DLL) (0) | 2012.09.12 |
댓글