- 클라이언트에서 사용자로부터 정보를 입력받기 위해 < form >태그 사용
1. 형식
<form action="호출할 서블릿" method="get or post">- action : 전송(submit) 버튼을 누르면 action에 기술한 url에 저장된 파일로 이동
- method : 어떤 방식으로 데이터를 넘겨줄 것인가(get or post)
get 방식 : 사용자가 입력한 결과를 알 수 있도록 내용 공개
post 방식 : 사용자가 입력한 내용 발송시 해당 내용 비공개
2. 전송(submit) 버튼
ex)
<input type="submit" value="전송">- input 태그의 type을 submit으로 지정 시 버튼 형태로 출력, 버튼 위에 나타날 값을 value에 지정
3. 취소(reset) 버튼
ex)
<input type="reset" value="취소">4. 쿼리 스트링(Query String)
- 사용자가 입력한 데이터를 서버로 전달
형식
리소스?name=values&name=value&...- = 기호를 중심으로 앞이 이름, 뒤가 값이며 &로 쿼리 스트링을 연결
- 영문, 숫자는 그대로 전달되지만 공백은 +로, 한글은 %와 함께 16진수로 변환되어 전달
1) 텍스트 박스
ex)
<input type="text" name="텍스트 박스 이름">- 텍스트 박스에 입력한 내용은 name=사용자가입력한값 이 쿼리스트링으로 전달된다.
2) 사용자 입력값 서블릿 저장
- request 객체의 getParameter() 메소드를 통해 값을 읽어올 수 있다.
ex)
- 다음과 같이 사용자가 입력한 값이 서블릿의 String id = "pinksung"; 저장
5. 사용자 입력 데이터 유효성 처리
- 사용자가 폼에 입력한 데이터가 유효하지 않은 경우 서버로 보내기 전, 데이터가 유효한지 판단하여 사용자가 데이터를 다시 입력하도록 유도해야한다.
이는 html이나 jsp로는 불가능하고 자바스크립트를 사용해야 한다. - 여러 html 문서에 사용된 자바스크립트 내용이 반복적일 경우 html파일마다 같은 내용을 기술하지 않고 자바스크립트 부분만을 독립된 파일로 구성 후, 이를 html문서에 삽입한다
<script type="text/javascript" src="js파일명.js"></script>- 자바스크립트 html문서 삽입
로그인 폼 ex)
function check() { //frm : form name, id, age : input name
if (document.frm.id.value == "") { //공백 입력 불가
alert("아이디를 입력해주세요.");
document.frm.id.focus();
return false;
} esle if (isNaN(document.frm.age.value)) { //숫자만 입력 하도록 제한
alert("숫자로 입력해주세요.");
document.frm.age.focus();
return false;
} else {
return true;
}
}6. 한글 입력시 깨지는 것 처리
1). 출력시 한글처리
response.setContentType("text/html; charset=UTF-8");2). dopost()메서드에서 한글 데이터 입력받기
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("UTF-8"); //post방식으로 데이터 전송되도 한글 안꺠지도록
}7. 같은 이름의 입력양식에 여러값 받기
- 여러 입력 양식을 만들어 동시에 여러 값을 동일한 이름으로 받아오는 경우 배열 형태로 값이 전송 된다.
이 때, getParameterValues()메서드를 사용해야 한다.
ex)
String 변수명 = request.getParameterValues("입력받아올JSP 변수명");