자바스크립트 연동해서 서버로부터 메시지 받아서 팝업 띄우기

Back-End/Spring 2019. 7. 24. 16:45

1. 먼저 header파일에 라이브러리 태그 코드 추가


1
2
3
4
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
 
cs



2. jquery를 사용하기 위해 스크립트를 추가하고, 메시지를 보여줄 수 있는 alert함수를 호출하는 스크립트 코드를 추가


1
2
3
4
5
6
7
8
9
10
<!-- 회원정보에 없는 이메일을 입력할 시에 출력되는 경고창 -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
    $(function(){
        var responseMessage = "<c:out value="${message}" />";
        if (responseMessage != ""){
            alert(responseMessage)
        }
    })
</script>
cs



3. 서버의 컨트롤러 코드에서 반환할 ModelAndView 객체에 message 라는 이름의 오브젝트를 추가


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
//아이디 찾기 처리
    @RequestMapping("find_id.do")
    public ModelAndView find_id(String e_mail) {
        ModelAndView mav = new ModelAndView();
        MemberDTO dto = new MemberDTO();
        
        dto.setE_mail(e_mail);
        String user_id = memberservice.find_idCheck(dto);
        
        if(user_id != null) {
            mav.setViewName("find_id_result");    
            mav.addObject("user_id", user_id);
        
        }else {
            //아이디 찾기 실패
            mav.setViewName("find_user_id");
            //뷰에 전달할 값
            mav.addObject("message""회원가입된 회원의 이메일이 아닙니다");
 
        }
        
        
        
        return mav;
    }
cs




4. 결과 팝업창 화면



















출처

https://jhlblue.tistory.com/5

: