▶ 뭉충닷컴
 
mungchung.com login
Site Search
My Space
주절주절...
공부방
쥔장소개
Board
자유게시판
유용한 정보
자료실
Programming
강좌 & Articles
Spring 3.0
프로그래밍 Tip
   -ASP
   -PHP
   -JavaScript
   -HTML
   -Java/JSP
   -Database
   -Crystal Report
   -Visual Basic
   -이클립스
   -리눅스
   -기타
Windows API (VB)
Spread Sheet 7.0
컴퓨터활용 Tip
Other things
StarCraft 전략
StarCraft 문서
김용(金庸)
Son Q & Dieda

Tabular Data Control 기초 다지기 1

조회 수 15222 추천 수 0 2005.09.25 01:14:46

전체 샘플소스 다운받기 => tdc_example.zip

친구놈이 괴롭혀서 글 하나 쓴다. -_- 볼라면버고 안볼라면 보지말아라. 삶에 많은 도움이 되는 글은 아니다 그렇다고 괜히 글봐놓고서 욕하지 말아라. 일일이 답해주기도 귀찮다 -_-;

특히나 주로 나의 경험에 의존해서 쓰는것이기 때문에 더욱 그러하다. 어디까지나 나의 주관적 입장이기때문에 제3자의 입장에서 보면 '이게 아닌데..더 좋은 방법이 있는데..'하고 생각할수도 있다. 그러한 부분들은 나한테도 알려줬으면한다. 그래야 나도 고치지 않는가 -_- 아무튼 그런것들은 이해해주길 바란다. -_-; (말투가 반말인것도 이해해라. -_- 하도 반말로 글을 쓰다보니 존댓말로 '...입니다' 요러면 간살스러워서 도저히 글을 쓸수가 없다 -_-)

어떤것에 대해서 쓸까 고민 고민 하다가 결국 웹개발에 관련된 내용을 적게 되었다. 아무래도 내가 주로 웹프로그래밍만 하다보니 그나마 조금 나은게 웹쪽이다 -_- asp.net를 할까 생각도 했었는데 공부만하고 실무에 적용해본적이 없어서 적게 되면 단순히 모든 책에서나 볼수 있는 그러한 내용이 될듯 싶어서 쓸 생각을 말았다.

처음이니 만큼 좀 독특한것을 하겠다. TDC(Tabular Data Control) 라고 데이타 바인딩 기법중 하나이다. 아마 msdn 에서 보신분들도 있을것이다. 사실 이러한 글(TDC 관련글) 봐도 실무에 적용하기는 그리 쉽지 않은데 내가 현재 맡고 있는 사이트는 TDC를 거의 모든 곳에서 이용했다.

이 사이트 개발 팀장분이 이 TDC를 적용하셨는데 아마도 우리나라에선 거의 최초로 적용된 사이트 일듯 싶다. 왜냐면 이 TDC가 2000년 말경에 나왔는데 개발 팀장님이 2000년 말경부터 개발에 이용하셨다. 그리고 서점 가보면 알겠지만 asp 책 찾아보면 TDC를 다룬 책은 한권도 없다. -_- (RDS 다룬 책에서 잠깐 언급한 곳은 있다 -_- Wrox의 Professional ADO 2.5 RDS Programming with ASP 3.0 책을 봐라 -_-) 내가 웹서핑하면서 TDC 이용한곳을 딱 2곳 보았는데 한곳은 코라이닷컴 채팅방이고 다른 한곳은 태오사이트 자료실에 TDC를 이용한 게시판이란 것이 있어서 봤다. 외국도 마찬가지고 울나라도 마찬가지고 잘 사용하지 않는 기술이다 -_-;

그렇다면 잘 사용하지도 않은 TDC를 왜 설명할까? 알고 싶다면 아래의 내용을 읽어보면 된다. -_-;

TDC의 장점&단점

그렇다면 TDC를 이용한 장점은 무엇일까! 나의 경험상 정리해 보면 다음과 같다.
    - 디자인과 코드의 분리 (가장 강력하다!)
    - 페이지 오류가나와도 클라이언트는 단순한 HTML 페이지만 보게 된다.
    - 서버단 처리로 페이지의 이동 없이 데이타를 처리할수 있다.
    - 등등.. -_-;

그 몇가지 더 있는데 어떻게 말로 풀어서 설명하기 힘들다.(내가 어휘력이 조금 약하다 -_-)
장점이 있다면 당근 단점이 있다. 단점으로 보자면
    - 페이지수가 많아진다. (서버단 페이지가 하나씩 늘어난다 -_-..이는 asp.net 에서 code behind 기법을 생각하면 된다.
       보여지는 asp페이지와 그 asp 페이지를 처리하는 서버단 페이지) 
    - 디버깅이 불편하다

음..생각해보니 지금은 2가지 밖에 생각이 안난다.. 아마도 거의 1년동안 사용해서인지 불편함을 이제는 잘 못느껴서 그런것같다.-_-

Sample Source

음..잔말이 많아졌는데 일단 아주 간단한 예제라도 보자. 예제 보는것이 잔말 10번보는것보다 더 나으니 말이다. -_- 메모장이나 텍스트에디터에서 다음 소스를 복사해서 붙여넣거나 코딩을하자 (실제로 코딩을 해보는게 영타도 늘고 도움이 많이 될꺼다. 내 경우는 예제 나오면 거의 실제로 다 코딩했다. 눈으로 보고 이해하는것이랑 실제로 코딩해보는것이랑은 아무래도 차이가 있다. 귀찮으면 영타익힌다는 생각으로 코딩해라 -_-) list.txt는 데이타 페이지고 list.htm은 보여주는 페이지이다.

list.txt

Name¶SongName^
|신해철|¶|내 마음 깊은곳의 너|^
|신해철|¶|안녕|^
|신해철|¶|절망에 관하여|^
|신해철|¶|그대에게|^
|신해철|¶|매미의 꿈|^
|신해철|¶|It's alright|^
|서태지|¶|난 알아요|^
|서태지|¶|하여가|^
|서태지|¶|필승|^
|서태지|¶|환상속의 그대|^
|서태지|¶|우리들만의 추억|^
|서태지|¶|ㄱ나니|^

list.htm

<OBJECT id=List CLASSID="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">
    <PARAM NAME="UseHeader" VALUE="true">
    <PARAM NAME="DataURL" VALUE="list.txt">
    <PARAM NAME="TextQualifier" VALUE="|">
    <param NAME="FieldDelim" VALUE="¶">
    <PARAM NAME="RowDelim" VALUE="^">
    <PARAM NAME="CharSet" VALUE="euc-kr">
</OBJECT>
<table border="1" DataSrc="#List">
    <thead>
    <tr>
        <td>가수</td>
        <td>곡명</td>
    </tr>
    </head>
    <tbody>
    <tr>
        <td><span datafld="Name" DATAFORMATAS="HTML"></span></td>
        <td><span datafld="SongName" DATAFORMATAS="HTML"></span></td>
    </tr>
    </tbody>
</table>

실행화면을 보면 다음과 같다.
1-01.gif 
list.txt 파일의 내용과 브라우저에 뿌려진 결과를 잘 비교해 보자 (귀차니즘을 극복하고 빨강색과 파란색의 효과를 넣었다. -_-)
1-02.gif 

소스 설명
예제를 실행해보면 테이설명블이 동적으로 생성되는 듯한 느낌을 받을것이다.(뭐.워낙 빠르면 그렇게 안보일수도있다 -_- 이럴경우 새로고침을 계속 해보면서 어떤가 살펴봐라) 귀찮지만 소스 설명을 하겠다. -_-; 일단 list.htm 페이지를 보면 OBJECT 태그를 이용해서 객체를 호출하였는데 classid를 보면 333C7BC4-460F-11D0-BC04-0080C7055A83 이라고 적혀있다. 이 값을 레지스트리에서 검색해보면 Tabular Data Control 이라라는것 확인할수 있을것이다.

음..혹 모르시는 분들을 위해서 object 태그에 대해서 간단하게 몇마디 하겠다. object 객체는 쉽게 말해서 active x 객체를 호출한다고 보면된다. 기존의 html 태그외에 좀더 확장적인 기능을 구현하고자 한다면 active x 기술을 이용하는데 이것이 적용된 가능 좋은 예로는 플래쉬이다. 플래쉬 삽입하는 태그를 살펴보면 object 태그 이용후 classid를 적을것이다..뭐 그 외에 파라미터들 몇가지 적어주고..

object 태그를 만나면 익스플러워는 일단 자기 컴퓨터의 레지스트리를 검사한다. 그래서 그 값이 있으면 그 값이 가리키는 파일을 호출해서 그 파일을 웹에서 이용할수 있도록 호출한다. 만약 없다면 object 태그의 codebase 속성에 할당된 값을 보고 그 곳에서 active x 컨트롤을 다운로드해서 자기 컴퓨터에 설치를 시킨다.(한게임, 은행의 인증서 설치, 코멧커서..등등..아마도 정말 많이 봤을것이다 -_-)

음..말을 적고보니 어려워진것 같다. 역시 에제을 봐야쉽다 -_-;

브라우저에 다음과 같은 태그가 있다하자.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab">
    <param name=movie value="../img/falsh_10.swf">
    <param name=quality value=high>
</object>

익스플로러는 자신의 레지스트리에서 D27CDB6E-AE6D-11cf-96B8-444553540000 값이 있나 검사를 한다. 없다면 codebase 속성에 정의된 URL(http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab) 로 가서 파일을 다운 받은후 설치를 한다. 있다면 아래 그림처럼 레지스트리에 등록된 파일의 경로 (C:\WINNT\System32\macromed\flash\Flash.ocx) 를 이용해서 active x 파일을 호출한후 브라우저에서 이용한다.
1-04.gif  

TDC도 이와같은 방식이다. 근데 TDC를 적은 태그를 보면 codebase 속성이 없다. 왜냐면 이 TDC 컨트롤은 익스플러워 4.0버젼부터 지원하기 때문이다. 즉 윈도우에 기본 내장된 컨트롤이다 -_- (기본 내장이 맞는지는 확신 못하겠지만 4.0부터 지원은 확실하다..그렇게 msdn에 나와있었다 물론 익스플러워 4.0버젼에서 테스트해보진 않았따 -_-;;)

브라우저에서 TDC 컨트롤을 호출했으니 다음과 같은 태그를 이용해서 파라미터들을 넘겨준다.

<PARAM NAME="UseHeader" VALUE="true">    <- 헤더 사용여부
<PARAM NAME="DataURL" VALUE="list.txt">  <- 데이타 URL
<PARAM NAME="TextQualifier" VALUE="|">   <- 텍스트 구분자
<param NAME="FieldDelim" VALUE="¶">      <- 필드 구분자
<PARAM NAME="RowDelim" VALUE="^">        <- 열 구분자
<PARAM NAME="CharSet" VALUE="euc-kr">    <- 문자셋

헤더 사용여부(UseHeader)는 list.txt에서처럼 Name¶SongName^ 이렇게 해더를 정의해 줄것인지를 나타낸다. 데이타 URL(DataURL)은 말 그대로 데이타가 있는 페이지를 나타낸다. 여기서는 txt 파일을 했는데 파일 확장자는 아무거나 해도 상관없다 데이타 형식만 지켜주면 된다.  텍스트 구분자(TextQualifier)는 어디까지가 문자의 시작이고 문자의 끝인지를 지정하기 위해서 적는다. 보통 일반적으로 " 이렇게 따옴표를 이용하나 텍스트에 따옴표가 들어갈수 있으니 잘 사용하지 않는 | 문자를 이용했다.
필드 구분자(FieldDelim)는 필드의 구분을 나타낸다. 이것도 일반적으로 탭을 이용많이 하는데 문자에 역시 탭이 있을수도 있으므로 ¶ 문자로 했다.  열 구문자(RowDelim)도 마찬가지 이유다. 보통 엔터를 쳐서 줄바꿈을 열 구분자로 하는데 줄바꿈 문자가 있을수 있어서 ^ 으로 하였다.-_-  문자셋(CharSet)은 euc-kr로 해줘야지 안그러면 한글안보인다 -_-

데이타 URL에서 list.txt 파일을 읽으면 TextQualifier, FieldDelim, RowDelim 등의 기준에 맞게 데이타를 분석한후 브라우저에 보여준다. 보여주게될 태그는다음과 같다.

<table border="1" DataSrc="#List">
    <thead>
    <tr>
        <td>가수</td>
        <td>곡명</td>
    </tr>
    </head>
    <tbody>
    <tr>
        <td><span datafld="Name" DATAFORMATAS="HTML"></span></td>
        <td><span datafld="SongName" DATAFORMATAS="HTML"></span></td>
    </tr>
    </tbody>
</table>

테이블을 하나 만든후 DataSrc 속성에 object의 id 값을 적는다 이때 꼭 id 앞에 #을 붙여줘야한다. 왜그런지는 나도 모른다. -_- xml도 그렇고 이것도 그렇고 똑같이 object를 이용해서 호출한 id 앞에는 #을 붙여주는것 같다. 테이블의 DataSrc 태그에 속성을 줬으면 제목 열은 <thead></thead>태그로 감싸고 내용이 보여질 열은 <tbody></tbody> 태그로 감싼다. 테스트 해보면 알겠지만 <thead></thead>로 감싸진 태그는 데이타가 루프돌면서 뿌려지지 않고 <tbody></tbody> 부분만 자동으로 데이타들이 루프돌면서 뿌려진다.  따라서 만약 다음과 같이 한다면 가수, 곡명이 루프돌면서 뿌려진다. -_-

<table border="1" DataSrc="#List">
    <tbody>    //tbody 태그가 여기서 시작한다.
    <tr>
        <td>가수</td>
        <td>곡명</td>
    </tr>
    <tr>
        <td><span datafld="Name" DATAFORMATAS="HTML"></span></td>
        <td><span datafld="SongName" DATAFORMATAS="HTML"></span></td>
    </tr>
    </tbody>
</table>

아래와 같이 이상하게 데이타가 뿌려진다 -_-
1-03.gif 

다음 태그를 보자

<span datafld="Name" DATAFORMATAS="HTML"></span>

span 태그를 이용했는데 속성에 datafld 가 있다 이 부분은 Name¶SongName^ 을 생각하면 된다. 여기선 datafld 에 Name 값을 지정했는데 그럼 list.txt 의 Name에 해당하는 부분의 값만 가져온다. (datafld=SongName는 역시 list.txt 파일의 SongName 부분에서 로드한다.) 이런식으로 해서 데이타 URL의 페이지와 HTML 페이지와 서로 상호관에 통신이 가능하다. dataformats 는 데이타 형식을 지정하는 속성인데 HTML 외에 TEXT도 있다.

아마도 이 TDC 보면서 xml 과 비슷하다고 생각하시는 분들도 계실것이다. 사실 이용하는 방법이 거의 xml 이랑 흡사하다. 아래는 xml 의 코드 예시다.. (적고보니 거의 똑같군 -_-)

<xml id="List" src="myxml.xml"></xml>
<table border="1" DataSrc="#List">
    <tbody>
    <tr>
        <td><span datafld="Name"></span></td>
        <td><span datafld="SongName"></span></td>
    </tr>
    </tbody>
</table>

xml이 있는데 굳이 왜 TDC란 기술을 MS에서 만들었는지는 잘 모르겠다 -_-; 그러고 보면 비슷 비슷한 기술들이 상당히 있다 이 TDC도 ADO와 비스무리하게 이용되기도 한다. (일명 단절된 레코드 셋이라고도 하는데 영문명은 기억이 잘안난다. 집이면 책찾아서 영문명 적어주겠지만 지금은 회사이다 -_-... 앗 일안하고 내가 뭐하지 -_-)


*) 참고로 테이블의 기본 구조는 다음과 같다.

<table>
    <thead>   // 머리
    </thead>
    <tbody>   // 몸 <- 여기서만(tbody) 루프돈다.
    </tbody>
    <tfoot>   // 발 -_-
    </tfoot>
</table>

TDC에 관해서 좀 더 자세한 정보를 얻고 싶다면 다음 링크를 가보면 된다. 그곳에 TDC에 관해서, 속성, 메서드 예제 등등이 영문으로(!!) 적혀있다 -_-;

-> TDC : http://msdn.microsoft.com/workshop/database/tdc/overview.asp
-> TDC Reference : http://msdn.microsoft.com/workshop/database/tdc/reference/objects.asp

언제나 내가 내 글 적고난후 보면서 느끼지만 도대체 뭔소리를 하는지 모르겠다 -_-; 내 스스로도 정리가 안된다. 이소리 했다가 저 소리 했다가 -_-; 아무튼 잔설명이 많았는데 예제로 제시한 예를 계속 야리다보면 자동으로 이해가된다.

내가 프로그래밍 공부할때 이용한 방법중 하나가 열라 야리는것이다. 잘 모르는 로직이나 내용 있으면 그것 계속 야리다보면 어느순간 이해가 된다. -_- 이 TDC도 알고나면 간단하지만 처음 접하는 분들은 좀 어려울수도 있다. 포기하지 말고 가만히 계속 쳐다보면 어느순간 이해가 된다. 내 경우 처음에 TDC를 이용했을때 가장 기본적인 소스 가져다 놓고 계속 쳐다봤다 (음..나는 머리가 많이 나뻐서 오래 쳐다봤다 -_-;;)

오늘은 아주 간단한 TDC 설명에 대해서 설명했는데 이것을 잘 활용해서 확장하면 멋진 기술이 나온다. -_-; 그것은 다음시간에 적도록 하겠다. 거즘 1시간동안 적었더니 머리가 아프다. 이제 이것 적은 후 이 페이지 이쁘게(?) 치장해 줘야한다..그것도 일인데 -_-;; 아무튼 그만 적는다 -_-)/



댓글 '1'

지니

2006.05.22 13:56:23
*.231.158.87

강좌리스트에서도 TDC를 이용하나 보네요.
그리고 TDC 단점 중 하나를 소개하면 IE에서만 사용이 가능하다는 점입니다. 그래서 일반 웹서비스에서 별로 볼 수 없습니다.특히 외국의 경우 웹접근성과 브라우져 호환성, 웹표준을 준수하는 사이트가 많아서 더더욱 보기 힘들죠. 그래서 웹서비스 보다는 인트라넷과 같은 제한된 서비스를 할 경우에 적당할 것 같습니다.
문서 첨부 제한 : 0Byte/ 2.00MB
파일 크기 제한 : 2.00MB (허용 확장자 : *.*)
List of Articles
번호 제목 글쓴이 날짜 조회 수
27 keyfile을 이용한 ssh 접속 방법 뭉충닷컴 2010-10-28 13684
26 멀티 브라우저 지원하는 frame, iframe 접근 코딩 방법 [3] 뭉충닷컴 2010-07-21 26318
25 crontab을 이용한 Tomcat 서버 자동 재시작 shell 뭉충닷컴 2009-08-28 25018
24 자바스크립트로 각 form의 element(요소)에 접근 방법 file [2] 뭉충닷컴 2008-09-11 55964
23 ERwin 에서 Logical의 컬럼명을 코멘트(Comment)로 변경하기 file [2] 뭉충닷컴 2008-01-16 31740
22 Tabular Data Control 마지막 강좌! 뭉충닷컴 2007-06-14 15702
21 ASP로 웹 어플리케이션 주소 사용하기 file 뭉충닷컴 2006-12-10 17907
20 VB로 WebBrowser 컨트롤의 HTML 제어 file 뭉충닷컴 2006-12-01 21389
19 ASP 페이징 쉽게 처리하기 file [4] 뭉충닷컴 2006-08-29 24244
18 두개의 비슷한 DB를 비교해서 변경된 부분 찾아내기 file 뭉충닷컴 2006-05-03 15000
17 ASP에서 Class 를 이용해보자 file 뭉충닷컴 2006-02-26 24770
16 Hotmail의 DHTML EDITOR 편집기를 이용해보자. file [34] 뭉충닷컴 2006-02-04 30232
15 Tabular Data Control 응용 - 제목 Sort (정렬) 쉽게 하기 [3] 뭉충닷컴 2006-01-27 14141
14 스크립트(Script) 코드를 암호화 시켜보자(Encode/Decode) [2] 뭉충닷컴 2005-06-10 19107
13 dll을 이용한 로그인 file [1] 뭉충닷컴 2005-11-25 22021
12 Tabular Data Control 응용 - 페이징 처리하는 3가지 방법 file [1] 뭉충닷컴 2005-11-23 16271
11 Query를 잼있고, 유용하게 사용해보자 file [3] 뭉충닷컴 2005-10-01 14724
10 Tabular Data Control 응용 - 테이블의 행 배경색이 격으로 변하게하기 뭉충닷컴 2005-09-25 15796
9 폼(Form) 검증해주는 스크립트(Script) file [15] 뭉충닷컴 2005-06-07 19262
8 asp 로 서버에 zip 압축/압축해제(풀기) 예제 file [8] 뭉충닷컴 2005-08-12 19746
7 MS-SQL의 osql.exe 이용 하기 (도스상에서 sql 구문 이용) 뭉충닷컴 2005-09-25 19302
6 SQL Script 로 ERD와 테이블 생성 손쉽게하기 뭉충닷컴 2005-09-25 21602
5 Tabular Data Control 기초 다지기 4 - 마지막! file 뭉충닷컴 2005-09-25 14683
4 Tabular Data Control 기초 다지기 3 file 뭉충닷컴 2005-09-25 14477
3 Tabular Data Control 기초 다지기 2 file 뭉충닷컴 2005-09-25 14182
» Tabular Data Control 기초 다지기 1 file [1] 뭉충닷컴 2005-09-25 15222
1 OWC를 이용한 웹에서 엑셀 그래프 그리기 file [4] 뭉충닷컴 2007-12-19 18974