/**
* jpage for jQuery分頁插件
* 功能:指定頁數內靜態分頁,超過指定頁數後ajax請求下一組靜態分頁
* @author 陳健
* @version 1.0 beta 7
* @date 2008-07-08
* @param config 插件配置
*/
jQuery.fn.jpage = function(config){
init("#"+this.attr("id"),config);
/**
* 初始化,主程序
* @param t 容器的ID,帶#號
* @param config 插件配置
*/
function init(t,config){
//公有變量
if(!t) return;
var dataStore = config.dataStore; //數據
var totalRecord = config.totalRecord > 0 ? config.totalRecord : 0; //總記錄數
if(totalRecord == 0){
$(t).css("text-align","center");
$(t).css("line-height","50px");
$(t).html("很遺憾,沒有檢索到任何記錄!");
return;
}
var openCookies = config.openCookies != null ? config.openCookies : true;
var configPage = config.perPage > 0 ? config.perPage : 10;
var perPage = !openCookies || $.cookie(t+"_perPage") == null ? configPage : parseInt($.cookie(t+"_perPage"));//每頁顯示記錄數
var proxyUrl = config.proxyUrl != null ? config.proxyUrl : 'dataproxy.jsp'; //數據代理地址
var groupSize = config.groupSize; //組大小
var barPosition = config.barPosition == null || config.barPosition == ""? 'bottom' : config.barPosition; //工具條位置
var ajaxParam = config.ajaxParam; //ajax的請求參數
var showMode = config.showMode == null || config.showMode == '' ? 'full' : config.showMode; //顯示模式
var themeName = config.themeName == null || config.themeName == '' ? 'default' : config.themeName; //主題名稱
var dataBefore = config.dataBefore == null ? '' : config.dataBefore;
var dataAfter = config.dataAfter == null ? '' : config.dataAfter;
//私有變量
var totalPage = Math.ceil(totalRecord/perPage); //總頁數
var currentPage = !openCookies || $.cookie(t+"_currentPage") == null ? 1 : parseInt($.cookie(t+"_currentPage"));//當前頁碼
var startRecord; //每頁起始記錄
var endRecord; //每頁結束記錄
var gpStartPage; //組開始頁
var gpEndPage; //組結束頁
var gpStartRecord = 1; //組開始記錄
var gpEndRecord; //組結束記錄
//數據容器
var container = '
';
//添加工具條
var toolbar = '';
if(configPage 1){
if(!dataStore || currentPage == gpStartPage){
currentPage -= 1;
getGroupStartEnd();
getStartEnd();
getRemoteData();
}else{
currentPage -= 1;
getStartEnd();
loadData();
refresh();
}
}
}
);
btnFirst.click(
function(){
if(!dataStore || currentPage > 1){
if(gpStartPage > 1){
currentPage = 1;
getGroupStartEnd();
getStartEnd();
getRemoteData();
}else{
currentPage = 1;
getStartEnd();
loadData();
refresh();
}
}
}
);
btnLast.click(
function(){
if(!dataStore || currentPage < totalPage){
if(gpEndPage > 0 && gpEndPage < totalPage){
currentPage = totalPage;
getGroupStartEnd();
getStartEnd();
getRemoteData();
}else{
currentPage = totalPage;
getStartEnd();
loadData();
refresh();
}
}
}
);
btnRefresh.click(
function(){
getGroupStartEnd();
getStartEnd();
getRemoteData();
}
);
//页码输入框监听
valCurrentPage.keydown(
function(event){
var targetPage = parseInt($(this).val());
if(event.keyCode==13 && targetPage>=1 && targetPage<=totalPage){
if(!dataStore || gpStartPage > targetPage || (gpEndPage > 0 && gpEndPage < targetPage)){
currentPage = targetPage;
getGroupStartEnd();
getStartEnd();
getRemoteData();
}else{
currentPage = targetPage;
getStartEnd();
loadData();
refresh();
}
}
}
);
valPerPage.change(
function(){
perPage = parseInt($(this).val());
currentPage = 1;
totalPage = Math.ceil(totalRecord/perPage);
if(groupSize){
getGroupStartEnd();
getStartEnd();
getRemoteData();
}else{
getStartEnd();
loadData();
refresh();
}
}
);
/*********************************init私有函数***************************************************/
/**
* 置为正在检索状态
*/
function startLoad(){
$(t).addClass(themeName+"_container");
mask = document.createElement('div');
$(mask).addClass(themeName+"_mask");
$(mask).css("height",$(t).height());
$(t).append(mask);
$(t+" ."+themeName+"_pgRefresh").addClass(themeName+"_pgLoad");
$(t+" ."+themeName+"_pgSearchInfo").html("正在检索中,请稍后...");
}
/**
* 置为结束检索状态
*/
function overLoad(){
$(t+" ."+themeName+"_pgRefresh").removeClass(themeName+"_pgLoad");
$(t+" ."+themeName+"_pgSearchInfo").html('检索到 ' + totalRecord + ' 条记录');//,显示第 ' + startRecord + ' 條 - 第 ' + endRecord + ' 條記錄');
$(mask).remove();
}
/**
* 獲得遠程數據
*/
function getRemoteData(){
startLoad();
$.ajax(
{
type: "POST",
url: proxyUrl + "?startrecord="+gpStartRecord+"&endrecord="+gpEndRecord+"&perpage="+perPage ,
cache: false,
data: ajaxParam,
dataType: "script",
timeout: 30000,
success: function(msg){
eval(msg);
getStartEnd();
loadData();
refresh();
overLoad();
},
error: function(){
alert("請求失敗或超時,請稍後再試!");
overLoad();
return;
}
}
);
}
/**
* 獲得當前頁開始結束記錄
*/
function getStartEnd(){
if(groupSize){
startRecord = (currentPage-1)*perPage+1 - gpStartRecord + 1;
endRecord = Math.min(currentPage*perPage,totalRecord) - gpStartRecord + 1;
}else{
startRecord = (currentPage-1)*perPage+1;
endRecord = Math.min(currentPage*perPage,totalRecord);
}
}
/**
* 獲得當前組開始結束頁碼
*/
function getGroupStartEnd(){
if(groupSize==null)
return;
var groupId = Math.ceil(currentPage/groupSize);
gpStartPage = (groupId-1)*groupSize+1;
gpEndPage = Math.min(groupId*groupSize,totalPage);
gpStartRecord = (gpStartPage-1)*perPage+1;
gpEndRecord = Math.min(gpEndPage*perPage,totalRecord);
}
/**
* 刷新數據容器
*/
function loadData(){
var view = "";
for(var i=startRecord-1;i<=endRecord-1;i++){
view += dataStore[i].replace("{id}",gpStartRecord+i);
}
valContainer.html(dataBefore + view + dataAfter);
}
/**
* 刷新工具欄狀態
*/
function refresh(){
if(openCookies){
//當前頁碼寫入cookie
$.cookie(t+'_currentPage', currentPage);
$.cookie(t+'_perPage', perPage);
}
valCurrentPage.val(currentPage);
valStartRecord.html(startRecord);
valEndRecord.html(endRecord);
valTotalPage.html(totalPage);
btn.unbind("mousedown",pressHandler);
btn.bind("mouseup",unpressHandler);
btn.bind("mouseout",unpressHandler);
if(currentPage == 1 && currentPage != totalPage){
enabled();
btnGo.bind("mousedown",pressHandler);
btnPrev.addClass(themeName+"_pgPrevDisabled");
btnFirst.addClass(themeName+"_pgFirstDisabled");
}else if(currentPage != 1 && currentPage == totalPage){
enabled();
btnBack.bind("mousedown",pressHandler);
btnNext.addClass(themeName+"_pgNextDisabled");
btnLast.addClass(themeName+"_pgLastDisabled");
}else if(currentPage == 1 && currentPage == totalPage){
disabled();
}else{
enabled();
btnBack.bind("mousedown",pressHandler);
btnGo.bind("mousedown",pressHandler);
btnNext.addClass(themeName+"_pgNext");
btnPrev.addClass(themeName+"_pgPrev");
btnFirst.addClass(themeName+"_pgFirst");
btnLast.addClass(themeName+"_pgLast");
}
}
/**
* 移除按鈕disabled狀態樣式
*/
function enabled(){
btnNext.removeClass(themeName+"_pgNextDisabled");
btnPrev.removeClass(themeName+"_pgPrevDisabled");
btnFirst.removeClass(themeName+"_pgFirstDisabled");
btnLast.removeClass(themeName+"_pgLastDisabled");
}
/**
* 添加按鈕disabled狀態樣式
*/
function disabled(){
btnNext.addClass(themeName+"_pgNextDisabled");
btnPrev.addClass(themeName+"_pgPrevDisabled");
btnFirst.addClass(themeName+"_pgFirstDisabled");
btnLast.addClass(themeName+"_pgLastDisabled");
}
/**
* 添加按鈕按下狀態樣式
*/
function pressHandler(){
$(this).addClass(themeName+"_pgPress");
}
/**
* 移除按鈕按下狀態樣式
*/
function unpressHandler(){
$(this).removeClass(themeName+"_pgPress");
}
}
}