raykim
20
2017-11-09 13:43:42 작성 2017-11-09 13:48:09 수정됨
6
1535

Spring에서 Ajax이용한 아이디 중복체크 질문입니다.


BookController.java 

 
@Controller
@RequestMapping("/book/*")

public class BookController {

	public final static Logger logger = LoggerFactory.getLogger(BookController.class);

	@Inject
	private BookService service;

	@RequestMapping(value = "/register", method = RequestMethod.GET)
	public void registerGET(BookVO book, Model model) throws Exception {
		logger.info("register get .............");
	}	
	
	
	@RequestMapping(value ="/register", method =RequestMethod.POST)
public @ResponseBody String registerPOST(BookVO book, RedirectAttributes rttr, Boolean flag) throws Exception{
	
		
if(flag==false){
		
			
			System.out.println(book.getId());
			int rowcount= service.read(book.getId());	
			System.out.println("돌아옴");
			System.out.println(rowcount);
			
			
			
			return String.valueOf(rowcount); //Int 값을 String으로 강제형변환 => ajax success로 들어가는 리턴값
}

else
{
	logger.info("register post............");
	logger.info(book.toString());
	
	int aaa = service.regist(book);
	
	System.out.println("aaa==="+aaa);
	
	rttr.addFlashAttribute("msg","success");
	
	//ID를 받는다
	
	
	return "redirect:/book/listAll";
}


register.jsp  스크립트 부분입니다.

$("#checkbtn").click(function(){  //==아이디 중복체크 클릭이벤트==
			 $.ajax({
				
				type:"POST",
				url: "register", //아이디 중복 페이지
				data: {
					id : $("#id").val(),
					flag : "false"// url로 보낼 아이디값
				},
				success:function(data){
					
					if(data==0){
						alert("사용 가능");
					}
					else
						alert("사용 불가능");
				}
			})
		 
		})

<form action="register" method="post">


		<div align="center">
			<label for="id">책 번호</label> <input type="text" name="id" id="id"
				size="10" placeholder="Enter ID"> <button type="button" id="checkbtn">중복 확인</button>  						
		</div>
				
		<div align="center">
			<label for="name">책 제목</label> <input type="text"
				 name="name" id="name" placeholder="Enter Title">
		</div>
		<div align="center">
			<label for="price">가 격</label> <input type="text" id="price"
				  name="price" 	placeholder="Enter Price">
		</div>
		
		<!--  /.box-body -->
		<br>
		<div align="center">

		
			
			<input type="reset" id="reset">

			<button type="submit" id="submit">등 록</button>


		</div>
	</form>




< 구현 목표 >

일단 구현 목적이 register.jsp 뷰안에서 비동식으로 아이디 중복체크를 하고 데이터를 등록을하면

ListAll 뷰를 리다이렉트로 리턴하려고 합니다.


< 문제 >

2개의 @RequestMapping 을 같은 뷰에 같은 RequestMethod(POST 혹은 GET)로 설정하면 

에러가 납니다 (아마 어떤 것을 매핑하라는지 몰라서 그러는 것 같습니다만..)


그래서

@RequestMapping( value="/register", method=RequestMethod.POST) 안에 

아이디 등록과 아이디 중복 체크 2개의 기능을 한꺼번에 하려고 했습니다.

그러나 Ajax를 사용하는 아이디 중복체크인 경우에는 @ResponseBody 를 사용하게 되므로

중복 검사를 할 때는 기능이 잘 이루어지지만

데이터를 등록할 때는 페이지가 넘어가지않고 url값이 문자열로 뷰에 나타납니다.


@ResponseBody를 없애면 등록은 잘 이루어지는 데 아이디 중복체크할 때

data가 ajax success로 넘어가지 않습니다.  


어떻게 해야할까요?



0
0
  • 답변 6

  • shun10116
    168
    2017-11-09 14:25:56

    1. log 사용하시려고 생성하셧는데 sysout은... 로그 사용하시길 추천드리구여. Grep Console을 사용해서 잘 보시면 도움이 될 거라고 생각합니다.
    2. submit의 default event 속성이 무엇인지 검색해보시기 바라며, 비동기통신과 동기통신에 대해서 조사해보시기 바랍니다. 아마 form tag로 submit하면 비동기통신이 되지 않아, responsebody를 사용하지 않아야되는 것으로보입니다. 가장 좋은 방법은 ajax로 요청하여 결과값의 상태에 따라 javascript로 redirection시키는 것으로 보입니다.

    3. 혹은 ajax submit이라는 뭔가 있던데 전 사용한적 없지만, 검색해봐서 이용하면 해결책이 될 것으로 보입니다.

    1
  • raykim
    20
    2017-11-09 14:53:09

    @shun10116


    감사합니다

    주신 답변으로 연구해보겠습니다!

    0
  • speed1139
    1k
    2017-11-09 14:56:53

    비동기 통신과 동기 통신의 차이부터 먼저 검색 해보시고.. 원하시는데로 하시려면 제가 로그인 처리를 한부분을 올려드릴테니 이걸 참조해보세요. 

    //JSP 단 

    $.ajax({

    type:'POST',

    url:'호출주소',

    data:{  

                                    //파라미터를 담는구절                        

                                    아이디:아이디,

    패스워드:패스워드

    },

    success:function(data){

    //데이터가 1,1 식으로 넘어오므로 분할 한다. 분할후 변수에 재 할당

    var str = data.split(",");

    아이디= str[0];

    패스워드= str[1];

    if(아이디== 0)

    {

                                            //아이디가 없는경우

       if(confirm("등록된 계정이 없습니다. \n등록하시겠습니까?") == true)

    {

                                                  //유저 등록폼 호출 주소 호출

                                                  location.href = '<c:url value="/regaccount" />';

    }

    else

    {

    return false;

    }

    }

    else

    {

    if(userId == 1 && passWord == 1)

    {

    //아이디와 비밀번호가 일치하면

    //Form 을 submit()함

    document.getElementById("loginForm").submit();

    }

    else

    {

    alert('비밀번호가 일치하지 않습니다.');

    return false;

    }

    }

    }

    });

    1
  • ComPuTa
    230
    2017-11-09 16:02:45

    위로직을 보니 등록은 submit 처리이고 

    중복체크는 ajax를 통해서 하시네요... 


    첫번째 위 jsp 단을 수정하지 않으시려면 ( ajax의 url은 수정.. )

    Controller 에서 등록 과 중복체크 부분을 분리 하는게 좋을 듯 합니다. 


    두번째  중복체크 및 등록을 둘다 ajax로 처리를 하시면 됩니다. 

    그렇다면 controller 에서 등록및 중복체크를 분리할 필요는 없겠죠..

    중복시에 대한 return json 값과 등록시의 return json 값을 판단하신후 

    등록이 완료되었다면 다음 url로 이동하면 되겠죠.. 




    1
  • raykim
    20
    2017-11-09 16:31:27

    감사합니다! 두 방법 다 해보겠습니다

    0
  • raykim
    20
    2017-11-09 18:09:45


    
    	@RequestMapping(value ="/register", method =RequestMethod.POST)
    public String registerPOST(BookVO book, RedirectAttributes rttr) throws Exception{
    
    	logger.info("register post............");
    	logger.info(book.toString());
    	
    	int aaa = service.regist(book);
    	
    	System.out.println("aaa==="+aaa);
    	
    	rttr.addFlashAttribute("msg","success");
    	
    	//ID를 받는다
    	
    	
    	return "redirect:/book/listAll";
    }
    
    
    
    
    @RequestMapping(value="/checkSignUp", method=RequestMethod.POST)
    public @ResponseBody String checkSignPost(@RequestParam("id") int id)throws Exception{
    	
    	
    	System.out.println(id);
    	int rowcount= service.read(id);	
    	System.out.println("돌아옴");
    	System.out.println(rowcount);
    	
    	
    	
    	return String.valueOf(rowcount); //Int 값을 String으로 강제형변환 => ajax success로 들어가는 리턴값
    }
    	
    }
    


    컨트롤러 단에서 나눴는데 되네요..저는 register에서 작업하려면 RequestMapping value값을 모두 register로 맞춰줘야한다고 생각했는데 엄청 잘 못이해하고 있었습니다..


    value이름을 chekSignUp으로 바꿔서 따로 했더니 잘 됩니다 .. ㅠㅠ 감사합니다.

    0
  • 로그인을 하시면 답변을 등록할 수 있습니다.