https://web.archive.org/web/20161113054809/http://www.xeschool.com/xe/xenote_module_form_db
XE 모듈을 이해하기 위한 기초 과정으로 폼(form)의 동작 방식을 살펴보자. 모듈은 결론적으로 폼과 DB의 관계이다. 모듈은 자신이 관리하는 테이블을 한두개 이상 가지고 있고 이것을 다루기 위해 폼을 사용한다. 이때 모듈에서의 폼의 처리 과정은 모델 뷰 컨트롤러 (Model-View-Controller) 개발 패턴에 기반한다. 다시말해 폼의 기본적인 동작 방식을 이해하면 MVC 패턴으로 확장된 XE 모듈을 더욱 쉽게 이해할 수 있다. 다음의 내용은 폼 엘리먼트를 이해하기 위한 중요한 키워드이다.
※ 폼을 이해하는 다음 과정에서 DB에 테이블(Table)을 만들고, 데이터 입력 필드를 추가하는 것, PHP 파일에서 DB와의 연결 및 입력/수정/삭제 쿼리, 폼(form)의 입력 컨트롤 타입의 종류와 사용법 등은 다루지 않는다. 자세한 사용법은 별도의 공부를 통해 꼭 확인해 두자. 아래 내용은 폼의 기본적인 처리 과정과 흐름을 이해할 수 있도록 작성하였다.
폼은 HTML의 태그(Tag)이면서 특별한 역할을 담당하고 있는 엘리먼트이다. 폼은 사용자(User)에게서 정보를 입력 받을 수 있는 입력필드(input)를 가진 웹페이지의 일부분이고, 입력 받은 자료는 하나로 묶어서 서버로 전송한다. 서버는 폼이 보내준 데이터를 처리하고 그 결과를 다시 웹브라우저에게 보낸다.
어떻게 이것이 가능할까?(How it is possible?)
폼의 기본 형식은 다음과 같다.
<form action=" " method=" ">
...
</form>
폼 엘리먼트에는 2개의 속성을 기본으로 가지고 있는데 action 속성과 method 속성이다. 이것들만 가지고는 아무일도 할 수 없다. 따라서 정보를 입력 받을 수 있는 입력필드를 1개 만들어 보자.(폼의 기타 속성, 폼 안에 들어가는 input 엘리먼트의 입력 컨트롤(type)의 종류와 사용법은 생략한다.)
<form action=" " method=" ">
<p>학교 : <input type="text" name="school" /></p>
</form>
한 줄짜리 간단한 형식의 글 입력 상자를 만들고 앞으로 입력 받는 내용은 [school]이라는 name 속성을 갖게 된다. 이것은 마치 "변수=값"처럼 한쌍을 이룬다. 하지만 이것을 지금 당장 변수와 값으로 부르지는 않는다. 왜냐하면 입력 받은 데이터는 아직 아무것도 실행된 내용이 없고 변수의 값으로 대입된 상태도 아니다. 그저 데이터 조각을 가리키는 임시 이름일 뿐이다. 따라서 name 속성이라고 하는 것이다.
다음으로 입력된 내용을 서버로 보낼 수 있는 전송(submit) 버튼을 만든다.