jsp에서 javascript로 유효성 검사하기
조회수 8171회
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
ul {
list-style:none;
}
li {
margin:10px;
}
li label {
width:120px;
float:left;
text-align:right;
padding-right:8px;
}
input[type="submit"] {
text-align:center;
width:100%;
height:30px;
margin-top:15px;
}
</style>
<link href="StyleSheet1.css" type="text/css" rel="stylesheet" />
</head>
<body>
<%@include file="myNav.html" %>
<%@include file="myNav1.html" %>
<form name="signupform" action="singUp_ok.jsp" method="post">
<fieldset>
<legend>로그인 정보</legend>
<ul>
<li>
<label for="user-id">아이디 </label>
<input type="text" name="user-id">
</li>
<li>
<label for="pwd1">비밀번호 </label>
<input type="password" name="pwd1">
</li>
<li>
<label for="pwd2">비밀번호 확인 </label>
<input type="password" name="pwd2">
</li>
</ul>
<input type="button" value="가입하기" onclick="signUpCheck()">
</fieldset>
</form>
</body>
</html>
<script language="javascript">
function singUpCheck() {
var form = document.signupform;
if(!form.user-id.value) {
alert("아이디를 입력해주세요");
form.user-id.focus();
return;
}
form.submit();
}
</script>
위에는 제 jsp 코드입니다.
자바스크립트로 유효성 검사하려고 하는데 가입하기 버튼을 눌러도 아무 반응이 없네요.
유효성 검사하는 코드가 맞는건지 확인부탁드립니다.
보통 개발자분들이 작업할때 스타일시트는 어디에 넣고 작업하시나요? jsp에 넣고 작업하시나요?
- jsp에서 스타일시트를 수정하면 바로 적용이 안되던데 왜그런가요?
-
(•́ ✖ •̀)
알 수 없는 사용자
1 답변
-
<script> function signUpCheck() { var form = document.signupform; if(!form['user-id'].value) { alert("아이디를 입력해주세요"); form['user-id'].focus(); return; } alert('success'); } </script>위 소스처럼 바꿔보세요.
- onclick 핸들러는 signUpCheck로 되어 있는데 실제 함수명은 singUpCheck로 되어 있네요.
- 하이픈은 식별자로 사용할 수 없습니다.
- 웹 개발에서 CSS 파일은 개발자가 손대지 않고 퍼블리셔라는 분들이 전담합니다. 같은 파일을 수정하는 일은 가급적 피해야하기 때문에 대부분의 경우 파일을 분리하죠. 퍼블리셔가 따로 없다 하더라도 CSS를 임베드(HTML안에 모두 작성하는 방식)하면 파일 하나가 너무 길어지기 때문에 관리 차원에서 분리하곤 합니다.
- HTML안의 자바스크립트를 디버깅 하실 때는 브라우저 개발자도구(F12버튼)의 콘솔창을 항상 확인하세요. 잘못 짜여진 스크립트의 에러 메시지가 출력된답니다.
- JSP에서 수정한 스타일이 바로 적용이 안된다는건 질문을 좀 더 구체적으로 해주셔야 할 것 같습니다. 굳이 유추를 해보자면 이클립스의 톰캣 플러그인으로 구동하신것 같은데요. 기본 설정에서 바꾸신게 없다면 톰캣 플러그인은 파일 변경을 감지했을 때 실제 반영에 걸리기까지 2초에서 3초정도 소요됩니다. (이 부분은 tomcat publish를 검색해 보세요)
- 말씀대로하니 정말되네요.. 매번 답변해주셔서 감사합니다. 알 수 없는 사용자 2017.4.25 01:05
- 말씀대로하니 정말되네요.. 매번 답변해주셔서 감사합니다. 답변해주신 5번같은 경우에는 WebContent 안에 같이 스타일시트파일을 넣고 그다음 jsp에서 링크 걸어준다음 적용한다음 제가 스타일시트를 수정하고싶어서 수정을 하고 다시 톰캣서버에서 컴파일을 하면 적용이 안된다는 말이였습니다. 알 수 없는 사용자 2017.4.25 01:05
- 그리고 혹시 패스워드랑 패스워드확인란이 같은지 체크하려면 자바스크립트를 사용해야하나요? 알 수 없는 사용자 2017.4.25 01:06
- 네. 비밀번호 확인같은 크게 중요한게 아닌 항목은 스크립트로 비교하죠. 스타일 수정이 바로 적용 안되는건 브라우저 캐시 문제일 수도 있겠네요. 편집요청빌런 2017.4.25 09:21
- 감사합니다 알 수 없는 사용자 2017.4.25 14:20
댓글 입력