<form>태그의 post 전송, 요청데이터가 바인딩되는 기준

form태그로 넘기면 되는걸 생각 못하고 ajax로 끙끙대면서 삽질했다...
혀튼 이번에 하려는건 페이지의 이동이있으니 form태그를 사용하면됨
매우매우 간단하다!

내 코드

보내고자 하는데이터를 input태그나 textarea같은 태그를 이용하여 jsp에 입력받든 숨겨두든 해준다.

							<input type="hidden" id="syear" value="">
                            <input type="hidden" id="smonth" value="">
                            <input type="hidden" id="sday" value="">
                            <input type="hidden" id="stime" value="">
                            <input type="hidden" id="speople" value="">
                            <input type="hidden" id="sselectSit" value="">
                            <input type="hidden" id="franId" value="${franId}">
                            
                            <script>
                            	$('button[name=process]').on("click",function(){
                            		alert(year+"년 "+month+"월 "+day+"일 "+time+"시, "+people+"명 "+selectSit+"좌석 예약.");
                            		$('#syear').val(year);
                            		$('#smonth').val(month);
                            		$('#sday').val(day);
                            		$('#stime').val(time);
                            		$('#speople').val(people);
                            		$('#sselectSit').val(selectSit);
                            		let franId = $('#franId').val();
                            		let url = '/CelebBack/reserve/menu/'+franId;
                            		$('form#wrapped').attr('action', url);
                            	});
                            	
                            </script>

나같은 경우엔 셀렉트한 값이 들어와줘야해서.... js를 통해 히든으로 숨긴 input태그를 채웠다.
그리고 form태그로 감싸주는데, 나는 템플릿이라 거기에 주는 action속성같은것도 js로 덧붙여져있다.

그래서 예시를 따로 들자면~

form태그 설정

<form action="" method="post">
  
  <input type="hidden" name="day" id="sday" value="1">

</form>

뭐 이런느낌 되시겠다!

form과 버튼 연결

submit 속성의 버튼을 form태그 안에 같이두면 그 form에 대한 제출로 인식하지만,
만약 나처럼 밖에다가 button을 선언할경우

<form action="/examples/media/action_target.php" method="get" id="loginForm">
    이름 : <input type="text" name="st_name"><br>
</form>
<button type="submit" form="loginForm">제출하기</button>

이렇게 버튼의 form속성에 원하는form의 id를 적어주면 된다.

이제 버튼을 누르면 원하는 링크로 이동하게 된다.

나의경우는 controller로 이동하도록 설정했다.(당연히 PostMapping) 그리고 구글링을 해보면 컨트롤러에서 form 데이터를 받으려면 vo객체를 만들어 컨트롤러의 파라미터에 넣으라고 지시한다. toString으로 프린트하면 볼 수 있다고 한다. 그런데 나의경우 vo를 다음과 같이 설정한 후

@Data
@Alias("ResvInfoVO")
public class ResvInfoVO {
	private String franId;
	private String year;
	private String month;
	private String day;
	private String time;
	private String people;
	private String selectSit;
}

toString()으로 출력해보면 일부값만 제대로 들어와버리는것이다.

석연치않다. 어쩐지 아주아주 미심쩍었다!! 템플릿을 쓰는바람에 혹시 내가 눈치못챈 숨겨진 input값이 있을수도 있는데 어떻게 알아서 바인딩을 해준다는거지? 심지어 타입도 모두 String이다!
그래서 검색을 해보니 궁금증이 해결되었다

form데이터는 어떤 기준으로 vo에 바인딩 되는가?

스프링MVC가 파라미터를 통해 VO객체를 선언함으로써,
자동으로 파라미터를 수집할때 폼 데이터의 경우 input태그나 textarea태그의 name속성과 선언된 vo클래스의 멤버변수 이름이 같아야 바인딩 시켜준다! 위에 있는 내 코드의 문제점은 name속성을 내맘대로 무시해버렸다는것!!!!!! vo에 맞춰서 name속성을 다시 써준다.

							<input type="hidden" name="year" id="syear" value="">
                            <input type="hidden" name="month" id="smonth" value="">
                            <input type="hidden" name="day" id="sday" value="">

요런식으로!
그러고 이제 toString()을 통해 값이 잘 들어왔는지 확인해보면

아주 잘 들어오는것을 확인할 수 있다!!

post 전송 이렇게 쉬운데 중프때는 왜그리 어렵게 느껴졌는지 모르겠다ㅎ
싹다 get으로만 넘겼던 과거를 회상하며,, 성장한 나자신에게 치얼스

참고 :
출처: https://wjheo.tistory.com/entry/Spring-Form데이터-컨트롤러에서-처리 [우공공:티스토리]