D. <디자인 페스티벌> 버튼에 링크되는 form.htm 화면의 제작 (14점)

1. ‘접수자 이름’을 입력하기 위한 폼 필드는 한 줄 글상자를 사용한다.

2. ‘접수자 비밀번호’를 입력하기 위한 폼 필드는 한 줄 글상자로 하고 입력받을 내용은 ‘암호’로 한다.

3. ‘접수자 성별’은 라디오 단추를 이용하여 작성한다. ‘남’은 ‘선택한 상태’, ‘여’는 ‘선택하지 않은 상태’로 한다.

4. ‘접수자 전화번호’ 입력을 위한 펼침 목록 폼 필드는 다음과 같이 작성한다.

전화번호 입력을 위한 한 줄 글상자 너비-글자수와 입력 가능한 최대 글자 수를 각각 4로 입력한다.

5. ‘접수 방법’은 펼침 목록을 이용하여 3가지 방법이 모두 화면에 한꺼번에 나타나도록 작성하고 여러 방법을 다중 선택할 수 있도록 여러 항목 선택 허용을 선택한다.

6. ‘접수자 E-mail’을 입력하기 위한 폼 필드는 한 줄 글상자를 삽입한다.

7. '특기사항 및 작품설명‘을 위한 폼 필드는 스크롤 글상자를 삽입한다. 글 상자 너비-글자수는 50을, 줄 수는 5를 입력한다.

8. ‘주문자 사진’은 폼 필드-파일찾아보기를 이용한다.

9. 미기재를 알리는 메시지 영역을 지정해 주어야 한다. 표의 미기재를 알리는 셀 영역에 HTML로 <span id="a"></span>을 입력한다.

10. 확인과 다시쓰기 버튼을 만들고 ‘확인’버튼을 클릭하면 작성된 내용이 메일로 발송되도록 하고, ‘다시쓰기’버튼을 클릭하면 작성한 내용을 모두 초기화하고 다시 작성할 수 있도록 한다. html 문서의 ‘확인’ 버튼에 onClick="javascript:sendit();을 추가한다.

11. ‘확인’버튼을 클릭하였을 경우 참가신청서의 미기재 내용을 출력하도록 작성한다.
출력은 ‘확인’버튼과 ‘주문자 사진’ 사이의 ‘미기재를 알리는 메시지 영역’에 표시되도록 한다.
예 : 접수자 이름을 입력하지 않고 ‘확인’ 버튼을 클릭하였을 경우 ‘미기재를 알리는 메시지 영역’에 ‘접수자의 이름이 필요합니다.’라는 메시지를 출력하도록 할 경우
===============================================
function sendit(){
if(document.order_form.name.value == ""){
document.all["a"].innerHTML = "<p align='center'><font color='blue'>:: 접수자 이름이 필요합니다. ::</font></p>";
document.order_form.name.focus();
return;
}
===============================================
* function sendit()( - onClick="javascript:sendit();의 sendit()와 같음
* document.order_form.name.value == "" - order_form이라는 이름을 가진 form의 name이라는 이름을 가진 한 줄 글상자의 값이 “”일 때
* document.all["a"].innerHTML - 미기재 메시지를 “a"영역에 출력하도록 함
<span id="a"></span>의 “a"와 같음
* document.order_form.name.focus(); - 커서를 미기재 영역으로 이동시킴

12. 미기재를 알리는 메시지 내용은 다음과 같이 작성한다. (10점)
=================================
alert("감사합니다.")
document.order_form.submit();
=================================
13. 참가신청서의 내용을 모두 입력하고 ‘확인’버튼을 클릭하면 새로운 창에 ‘감사합니다.’라는 메시지를 출력하고 ‘확인’을 클릭하면 폼 메일이 발송되도록 작성한다.
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
9,10,11,12번에 각 자바 스크립소스 어디에 넣는지좀.. =====란에 잇는거와 onClick="javascript:sendit(); 와<span id="a"></span> 넣는 방법좀..^^