$('#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,//当前页,但是该参数在初始化有效,在后期需要跳页时,需通过修改 newp 这个参数
//總頁數
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}
]
});
分享到:
相关推荐
Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。
采用 LINQ to SQL+Flexigrid for JQuery and Json 创建的ASP.NET MVC 模式程序例子。
jquery flexigrid;jquery flexigrid
Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。
flexigrid..... jquery grid plugin
jquery flexigrid与jquery tablesort 配合实现flexigrid的客户端排序功能。jsp项目,无需数据库即可运行
Flexigrid For Asp.Net MVC
jquery表格插件Flexigrid 将数据按照表格排列,类似与ext。
Flexigrid-Web2.0 jQuery表格插件 Flexigrid 是一个轻量级的Web2.0 jQuery插件。它包含很多非常Cool的特性,如主题定制、分页、工具栏、搜索、排序、ajax读取数据源、调整列宽高尺寸等。 一个中文实例教程: ...
Flexigrid For Asp.Net 多选,客户端排序,自定义
jquery 的一个grid,基本功能都有,不错
Jquery FlexiGrid JS 前后台数据的传值、对象 前台使用FlexiGrid 插件显示数据条数 注意:action层变量名对应
$("#flex1").flexigrid({ url: 'post2.php', dataType: 'json', colModel : [ {display: 'ISO', name : 'iso', width : 40, sortable : true, align: 'center'}, {display: 'Name', name : 'name', width : 180...
JQuery_插件FlexiGrid_之完全配置与使用
jquery 表格插件 Flexigrid
Flexigrid For Asp.Net Web版(2013-02-20)
Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。这个例子对...
此项目是struts2+json+flexigrid的完整实例,可帮助你对flexigrid快速上手,项目下载后直接导入自己的工程即可,所用jar包会另传,因为超出上传限制,还请理解。
很好用的一个插件,这个版本是php的,。net的没有调试好,以后会上传(成功后) 更多精彩,请访问建站易教程网:www.diyiyusuan.com
仿flexigrid表格控件,里面有data说明。滚动到底自己加载,可添加表头按钮,有停止滚动加载功能,jquery