[Java Script / jQuery] 입력값 받아와 get방식 URL 파라미터로 넘겨주기

Today's mission.

get방식 url 만들기

지난 시간 URL의 파라미터 정보를 읽어오는 방법에 대해 포스팅했었다. 

2014/04/14 - [프로그래밍/Java Script] - [Java Script] URL 파라미터 값 읽어오기-1

2014/04/16 - [프로그래밍/Java Script] - [Java Script / jQuery] URL 파라미터 값 읽어오기-2, JavaScript 함수 구조

오늘은 그 이전 단계인 파라미터 정보를 받아와 URL을 완성하는 방법에 대해 공부해보았다.

여기서 날짜와 시간을 입력받아 '인쇄' 버튼을 누르면 입력한 내용이 get방식으로 전달 될 것이다.

>> 소스보기

// 입력받은 날짜를 'yyyy-mm-dd' 형태로 변환
function convertDateFormat(date) {

	return date.substring(0, 4) + '-' + date.substring(5, 7) + '-' + date.substring(8, 10);
}
		
function openPrintPopup() {

	var $startDate = convertDateFormat($('input[name=printDayStart]').val());
	var $endDate = convertDateFormat($('input[name=printDayEnd]').val());
	var $startTime = $('select[id=printDayStartTime]').val();
	var $endTime = $('select[id=printDayEndTime]').val();

	var _url = (해당 url) + 
              '?fromDay=' + $startDate + "&toDay=" + $endDate 
              + "&fromTime=" + $startTime + "&toTime=" + $endTime;
	
	NewWindow(_url,(페이지 이름),'744','801','yes');
}

- $('select[id=printDayStartTime]').val()  :  selector를 통해 위치를 찾은 후 입력받은 값 받아오기

- 함수 convertDateFormat : 입력받은 날짜는 'yyyy.mm.dd' 형태이므로 'yyyy-mm-dd' 형태로 바꿔주기위해 필요

>> 결과화면

위에 입력창에 입력한대로 파라미터가 전달된 것을 볼 수 있다.