[JSP] hidden / disabled 차이 (파라미터가 서버로 가느냐)
by mini_min[JSP] hidden / disabled 차이 (파라미터가 서버로 가느냐)
✔️ hidden 객체
hidden 객체는 text 와 유사하며 서버에 전송할 파라미터가 화면에 표시될 필요 없는 경우 쓴다.
👩💻 클라이언트 페이지
아래 예제에서는 합/차/곱/몫 이라는 연산 버튼이 있기 때문에 연산자는 숨겨도 되는 부분이었다.
input 버튼을 hidden 으로 숨겼다.
<%@ page contentType="text/html; charset=UTF-8"%>
<%@page trimDirectiveWhitespaces="true" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h3> hidden 객체 </h3>
<!--
hidden 객체는 text 와 유사하며 서버에 전송할 파라미터가 화면에 표시될 필요 없는 경우 쓴다.
-->
<form action="ex22_ok.jsp" method="post">
<p>
<input type="text" name="num1" placeholder="첫번째수">
<input type="text" name="num2" placeholder="두번째수">
<input type="hidden" name="operator">
</p>
<p>
<button type="button" onclick="send('+');">합</button>
<button type="button" onclick="send('-');">차</button>
<button type="button" onclick="send('*');">곱</button>
<button type="button" onclick="send('/');">목</button>
</p>
</form>
<script type="text/javascript">
function send(oper) {
const f = document.forms[0];
if( ! /^(\d+)$/.test(f.num1.value)){
f.num1.focus();
return;
}
if( ! /^(\d+)$/.test(f.num2.value)){
f.num2.focus();
return;
}
f.operator.value = oper;
f.submit();
}
</script>
</body>
</html>
👩💻 서버 페이지
<%@ page contentType="text/html; charset=UTF-8"%>
<%@page trimDirectiveWhitespaces="true" %>
<%
request.setCharacterEncoding("utf-8");
int num1 = Integer.parseInt(request.getParameter("num1"));
int num2 = Integer.parseInt(request.getParameter("num2"));
String oper = request.getParameter("operator");
int result = 0;
if(oper.equals("+")){
result = num1 + num2;
}
if(oper.equals("-")){
result = num1 - num2;
}
if(oper.equals("*")){
result = num1 * num2;
}
if(oper.equals("/")){
result = num1 / num2;
}
//switch 도 가능하다~
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h3> 연산 결과 </h3>
<p>첫번째 수 : <%=num1 %> </p>
<p>두번째 수 : <%=num2 %> </p>
<p>연산자 <%=oper %> </p>
<p> 결과 : <%=result %> </p>
</body>
</html>
✔️ disabled 속성
: disabled 속성의 객체는 서버에 전송되지 않는다.
: hidden 객체는 서버에 전송은 된다... 하지만 disabled 속성은 서버로 전송 조차 되지 않는 파라미터가 된다.
👩💻 아래에서 나이는 disabled 속성을 줘봤는데....?
👩💻 ID 는 hidden 속성을 줘봤는데...
<form action="ex23_ok.jsp" method="post">
<p>번호 : <input type="text" name="num" value="1111" readonly="readonly"></p>
<p>이름 : <input type="text" name="name"></p>
<p>나이 : <input type="text" name="age" value="20" disabled="disabled"></p>
<p>
<input type="hidden" name="id">
<button type="submit">확인</button>
</p>
</form>
👩💻 서버 페이지
id 는 hidden 이라 안보이기만 했을 뿐 파라미터로 서버에 넘어왔다.
하지만 나이는 disabled 속성이라서 서버에 넘어오지 못했따 ㅠㅠ
<%@ page contentType="text/html; charset=UTF-8"%>
<%@page trimDirectiveWhitespaces="true" %>
<%
request.setCharacterEncoding("utf-8");
String num = request.getParameter("num");
String name = request.getParameter("name");
String age = request.getParameter("age");
String id = request.getParameter("id");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h3> 연산 결과 </h3>
<p>번호 : <%=num %> </p>
<p>이름 : <%=name %> </p>
<p>나이 <%=age %> </p> <!-- 안넘어옴 -->
<p>id : <%=id %> </p> <!-- 숨긴것 -->
</body>
</html>
'JSP' 카테고리의 다른 글
| [JSP] request 내장 객체 (0) | 2022.09.29 |
|---|---|
| [JSP] 영화관 자리 예매 기능 (feat. 엄청난 for문) (0) | 2022.09.29 |
| [JSP] 📓 파라미터 전송 예제 (폼 예제) (0) | 2022.09.28 |
| [JSP] getParameter / getParameterValues / getParameterMap /getParameterNames (0) | 2022.09.28 |
| [JSP] submit 여러 가지 방법 (0) | 2022.09.28 |
블로그의 정보
개발자 미니민의 개발로그
mini_min