입력화면 1 -> 입력화면 2 -> 입력화면 3 방식 질문입니다.
본문
보통 게시판 글쓰기에는 세로로 주~욱 쓰고 작성완료 누르면 끝나는데,
저의 경우엔 신청서, 서약서, 설명 해서 입력화면을 3군데로 받고 싶습니다.
예를 들면 입사지원서 작성할 때, 기본정보입력이 끝나고 다음버튼을 누르면 학력정보,
다시 다음 버튼을 누르면 자기소개서 작성하는 방식입니다.
영~ 감이 안잡히는데 가이드 좀 해주실 수 있을까요?
답변 5
http://www.jquery-steps.com/Examples
제이쿼리쪽 응용하셔서
폼을 새로 제작하셔야합니다.
간단한 설명으로는 가이드가 힘들며
해당 제이쿼리쪽의 form 예제를 살펴보시고
소스를 넣어가며 실습해보시는게 나을겁니다.
2가지 방법중 하나로 하시면 됩니다
1. 전페이지 => 다음 페이지 이동시 필드에 값을 hidden 으로 넣어서 가지고 다니면서
최종 디비 입력페이지에서 모두 입력을 받는 방법
신청서 작성 => 서약서 이동시 신청서 항목 post 또는 get 형태로 전송
서약서 화면에서 hidden 으로 넘어온 항목 모두 처리
서약서 작성 => 설명 페이지 이동시 앞으로 모든 항목 post 또는 get 형태로 전송
설명 페이지 form 에 hidden 형태로 처리
디비 입력페이지에서 모두 입력처리
2. 각 단계를 넘어갈때마다 임시테이블에 입력 시키고 최종 페이지에서 해당 임시테이블 내용을 가져와서 실제 테이블에 입력
=> 이건 예외처리 할게 많아서 비추천 합니다
저는 보통 신청서 입력완료후 다음누르면 임시저장하여 등록번호를 할당하고
서약서 , 설명이 추가 입력되면 정상등록 처리합니다
전 주로 ajaxform을 쓰고, 데이터는 세션을 씁니다.
뒤로가기등을 구현할때 훨씬 편하기도 하고요.
중간폼에 파일첨부라도 있을때나, 뒤로 갔다 다시 진행해도 데이터컨트롤방법이 제 개인적인 기준으로는 db보다 무척 편리합니다.
데이터가 많거나, 사용자가 폭증할거 같은 이벤트페이지는 서버메모리가 부족할 경우, db를 쓰기도 합니다.
환경에 맞게 판단하시면 될듯 합니다.
여러가지 방법이 있지만..
기존의 한 페이지 처럼 처리하고,
jquery 를 이용하여.. 단계별로 해당 단계 영역(div)를 보여주고 나머지는 숨기는 방식으로 처리하는 것이
비교적 간편하게 적용할 수 있는 방법 중 하나입니다.
[신청서]
[서약서]
[설명]
(버튼)
(1단계) : 신청서만 노출
(2단계) : 서약서만 노출
(3단계) : 설명만 노출
(버튼) click 에 onclick 이벤트 처리..
현재 단계에 대한 정보를 data 속성 또는 전역 변수에 저장한 뒤,
현재 단계 정보를 가져온 뒤 그에 따른 노출 및 다음 단계 이동 처리
var curr_step = 1;
$('#btn').on('click', function() {
if (curr_step == 1) {
$('#b').show();
$('#c').hide();
$('#a').hide();
curr_step = 2;
} else if (curr_step == 2) {
~
}
});