JQuery - 페이지 정보 자동 생성

Programming/JavaScript, Sencha 2016.05.28 20:24 Posted by 파란크리스마스

pagination.js 파일

// 페이지 생성 함수
// 인자1 : JQuery 객체 - 페이지 정보를 출력될 객체
// 인자2 : 전체 페이지수
// 인자3 : 현재 페이지수
// 인자4 : 페이지 호출시 호출할 함수
function genPageNum(id_pagenum, totalPage, curPage, event) {
	
	// 블럭에 표시 페이지수
	var block_size = 10;
	
	// 초기화
	id_pagenum.empty();
	
	// 현재 블럭
	var block = Math.floor((curPage-1) / block_size);
	
	// 현재 블럭의 시작 페이지
	var block_start_pagenum = 10 * block;
	
	// 현재 블럭에서 마지막 페이지 
	var loop_count = block_size;

	// 현재 블럭에서 마지막 페이지 구하기
	if (block == Math.floor(totalPage / block_size) && (totalPage % block_size) > 0)  {
		loop_count = totalPage % block_size;
	}
	
	// 이전블럭 표시 (curPage > 10 이상이면 표시)
	if (curPage > block_size) {
		id_pagenum.append(
				"[<b><a href='javascript:listDevice("+
				(block * block_size) +
				", last_device_type);'>Prev</a></b>]");
	}
	
	// 페이지 수 만큼 반복
	for (pagenum = 1; pagenum <= loop_count; pagenum++) {
		// 현재 페이지 처리
		if ((pagenum + (block * block_size)) == curPage) {
			id_pagenum.append(
					"<b><font color=\"red\">"+(pagenum + (block * block_size))+"</font></b>");
		}
		// 현재 페이지 외 처리
		else {
			id_pagenum.append(
					"[<b><a href='javascript:pagination__page_move("+
					(pagenum + (block * block_size)) +
					"," + event+ ");'>"+
					(pagenum + (block * block_size)) +
					"</a></b>]");
		}
	}
	
	// 다음블럭 처리
	if (block < Math.floor(totalPage / block_size)) {
		id_pagenum.append(
				"[<b><a href='javascript:pagination__page_move("+
				(1 + ((block+1) * block_size)) +
				"," + event+ ");'>Next</a></b>]");
	}
}

// 페이지 선택시 호출 되는 함수
function pagination__page_move(pagenum, event) {
	if (event!=undefined) {
		event(pagenum);
	}
}

인자4에 전달될 함수 예제

function stock_page_move(pagenum) {
	listDevice(pagenum, last_device_type);
}

페이지 자동 생성 함수 호출

genPageNum($('#pagenum', currentDoc), result.totalPage, result.CurPage, stock_page_move);
저작자 표시
신고


 

티스토리 툴바