http://www.flexigrid.info/ 下载flexigrid插件
http://www.iteye.com/topic/414611 实例
http://www.cnblogs.com/chu888chu888/archive/2009/04/19/1439078.html
http://codeigniter.com/forums/viewthread/75326/P440/ flexigrid 论坛
- 获得当前页数
- String pageIndex = request.getParameter("page");
- // 获得每页数据最大量
- String pageSize = request.getParameter("rp");
- // 获得模糊查询文本输入框的值
- String query = new String(request.getParameter("query").getBytes("ISO8859-1"),"UTF-8");
- // 获得模糊查询条件
- String qtype = request.getParameter("qtype");
获取选中行的id: alert($('#flex1').flexGetSelectedRows().attr("id"));
<table id="flex1" style="display:none"></table>
下载的代码中需要添加以下js:
$.fn.flexGetSelectedRows = function()
{
if($(this).get(0).grid) return $('tbody tr.trSelected',$(this).get(0).grid.bDiv);
};//end flexGetSelectRows me
$.fn.flexUnselectAll = function()
{
if($(this).get(0).grid) $('tbody tr.trSelected',$(this).get(0).grid.bDiv).removeClass("trSelected");
};//end flexUnselectAll me
$.fn.allSelectedRows = function(){
var rows = $(this).flexGetSelectedRows();
var ids = new Array();
if (rows.length > 0) {
//Get Selected Row Ids
rows.each(function(){
//ids.push(parseInt($(this).attr("id").split("row").join("")));
ids.push(parseInt($(this).attr("id")));
// alert($(this).attr("id")+"attr");
});
}
return ids;
}; //选中的全选 me
--------------------------------------------------------------------------
$('#sform').submit
(
function ()
{
$('#flex1').flexOptions({newp: 1}).flexReload();
alert($('#flex1').flexGetSelectedRows().attr("id"));
return false;
}
);
$('#EmployeeGrid').flexigrid({
//表格寬度(注意在IE不能使用100%之類字串)
width:$(window).width()-2,
//表格高度(注意在IE不能使用100%之類字串)
height:480,
//資料列雙色交差
striped:true,
//欄位雙色交差
novstripe:false,
//最小寬度
minwidth:400,
//最小高度
minheight:200,
//是否可調整視窗大小
resizable:true,
//遠端伺服的網址
url:'server/employee.php',
//資料送出模式
method:'POST',
//回傳的資料類型
dataType:'xml',
//連結資料失敗時的訊息
errormsg:'連線資料庫失敗',
//啟用分頁器
usepager:true,
//不重疊
nowrap:true,
//預設的頁數
page:1,//currentpage
//總頁數
total:1,//totalpages
//使用分頁大小選擇器
useRp:true,
//預設的分頁大小(筆數)
rp:15,//resultsperpage
//可選用的分頁大小
rpOptions:[10,15,20,25,40],
//標題
title:false,
//分頁器的顯示資訊
pagestat:'檢視{from}到{to},全部共有{total}筆資料',
//讀取時的訊息
procmsg:'資料讀取中,請稍後…',
//搜尋時送出附加自訂的query
query:'',
//搜尋自訂附加的欄位,請搜尋"//addsearchbutton"參考原始碼那段
qtype:'',
//空資料時的訊息
nomsg:'找不到符合絛件的資料',
//隱藏欄位數不得少於?
minColToggle:1,
//顯示或關閉隱藏欄位的開啟器
showToggleBtn:true,
//預設排序的欄位
sortname:'basic_name',
//預設排序的方式
sortorder:'asc',
//送出時隱藏
hideOnSubmit:false,
//限定單選
singleSelect:true,
//不得調整視窗寬度
nohresize:true
//自動讀取資料
autoload:true,
//區塊透明
blockOpacity:0.5,
//顯示隱藏欄位時呼叫的自訂函式
onToggleCol:false,
//改變排序方式時呼叫的自訂函式
onChangeSort:false,
//執行成功後呼叫的自訂函式
onSuccess:false,
//資料送出時呼叫的自訂函式
onSubmit:false,
//錯誤時呼叫的自訂函式
onError:false,
//當分頁大小選擇器被選擇時呼叫自訂函式
onRpChange:false,
//是否顯示右上角縮小視窗的按鈕
showTableToggleBtn:true,
//定義欄位資訊(以下為範例)
colModel:[
//第一個欄位
{display:'身份證字號',
name:'basic_unicode',
width:75,
sortable:true,
align:'center',
hide:false},
//第二個欄位
{display:'姓名',
name:'basic_unicode',
width:75,
sortable:true,
align:'center',
hide:false}
],
//自訂的參數(以下為範例)
params:[
//參數1(陣列型)
{name:'viewFields',value:['id','basic_unicode','basic_name']},
//參數2(單一型)
{name:'action',value:'view'}
/*
附註:另外以下為預設一定會送出去的物件參數,注意不要取同名
var param={
page:p.newp,
rp:p.rp,
sortname:p.sortname,
sortorder:p.sortorder,
query:p.query,
qtype:p.qtype
};
*/
],
//定義功能欄的按鈕資訊(以下為範例)
buttons:[
{name:'新增',bclass:'add',onpress:null},
{name:'刪除',bclass:'delete',onpress:null},
{separator:true}
],
//定義搜尋欄位資訊(以下為範例)
searchitems:[
{display:'身份證字號',name:'basic_unicode'},
{display:'聯絡手機',name:'contact_mobile'},
{display:'姓名',name:'basic_name',isdefault:true}
]
});