转自:http://www.blogjava.net/ilovebabyfat/archive/2012/04/06/373456.html

jqGrid学习之 ------------- 安装

1. 下载文件

1.     下载jqGrid的软件包,目前最新版本为4.4.1 下载地址为: http://www.trirand.com/blog/?page_id=6

2.     下载jQuery文件,目前最新版本为1.8.2 下载地址为: http://code.jquery.com/jquery-1.8.2.min.js

3.     下载jqGrid皮肤,下载地址为: http://jqueryui.com/themeroller/  我使用的是:ThemeRoller->gallery->cupertino样式

2. 准备文件

在项目的根目录下,建立相应的文件夹,放入下载的文件,目录结构如下图:

3. 页面中的代码
3.1、head中加入引用
css文件引入:
<link type="text/css" rel="stylesheet" href="jqGrid/themes/cupertino/jquery-ui-1.9.0.custom.min.css">
<link type="text/css" rel="stylesheet" href="jqGrid/themes/ui.jqgrid.css">

js文件引入:

<script type="text/javascript" src="jquery-1.8.2.min.js" />

<script type="text/javascript" src="jqGrid/js/jquery-ui-1.9.0.custom.min.js"/>

<script type="text/javascript" src="jqGrid/js/i18n/grid.locale-cn.js"/>

<script type="text/javascript" src="jqGrid/js/jquery.jqGrid.min.js"/>

4. jqGrid原理

jqGrid是典型的B/S架构,服务器端只是提供数据管理,客户端只提供数据显示。换句话说,jqGrid可以以一种更加简单的方式来展现你数据库的信息,而且也可以把客户端数据传回给服务器端。 对于jqGrid我们所关心的就是:必须有一段代码把一些页面信息保存到数据库中,而且也能够把响应信息返回给客户端。jqGrid是用ajax来实现对请求与响应的处理。

5. jqGrid参数

Jqgrid学习 -------ColModel API

ColModel 是jqGrid里最重要的一个属性,设置表格列的属性。

Json数据

需要定义jsonReader来跟服务器端返回的数据做对应,其默认值:

· jsonReader : {

·      root: "rows",

·      page: "page",

·      total: "total",

·      records: "records",

·      repeatitems: true,

·      cell: "cell",

·      id: "id",

·      userdata: "userdata",

·      subgrid: {root:"rows",

·         repeatitems: true,

·        cell:"cell"

·      }

这样服务器端返回的数据格式:

· {

·   total: "xxx",

·   page: "yyy",

·   records: "zzz",

·   rows : [

·     {id:"1", cell:["cell11", "cell12", "cell13"]},

·     {id:"2", cell:["cell21", "cell22", "cell23"]},

·       ...

·   ]

· }

jsonReader的属性

total

总页数

page

当前页

records

查询出的记录数

rows

包含实际数据的数组

id

行id

cell

当前行的所有单元格

自定义:

· jQuery("#gridid").jqGrid({

· ...

·    jsonReader : {

·       root:"invdata",

·       page: "currpage",

·       total: "totalpages",

·       records: "totalrecords",

·       cell: "invrow"

·    },

· ...

· });

· totalpages: "xxx",

·   currpage: "yyy",

·   totalrecords: "zzz",

·   invdata : [

·     {id:"1", invrow:["cell11", "cell12", "cell13"]},

·     {id:"2", invrow:["cell21", "cell22", "cell23"]},

·       ...

·   ]

repeatitems 
  指明每行的数据是可以重复的,如果设为false,则会从返回的数据中按名字来搜索元素,这个名字就是colModel中的名字

· jsonReader : {

·       root:"invdata",

·       page: "currpage",

·       total: "totalpages",

·       records: "totalrecords",

·       repeatitems: false,

·       id: "0"

·    }

·  totalpages: "xxx",

·   currpage: "yyy",

·   totalrecords: "zzz",

·   invdata : [

·     {invid:"1",invdate:"cell11", amount:"cell12", tax:"cell13", total:"1234", note:"somenote"},

·     {invid:"2",invdate:"cell21", amount:"cell22", tax:"cell23", total:"2345", note:"some note"},

·       ...

·   ]

此例中,id属性值为“invid”。 
一旦当此属性设为false时,我们就不必把所有在colModel定义的name值都赋值。因为是按name来进行搜索元素的,所以他的排序也不是按colModel中指定的排序结果。

用户数据(user data) 
在某些情况下,我们需要从服务器端返回一些参数但并不想直接把他们显示到表格中,而是想在别的地方显示,那么我们就需要用到userdata标签

· jsonReader: {

·   ...

·   userdata: "userdata",

·   ...

· }

· {

·   total: "xxx",

·   page: "yyy",

·   records: "zzz",

·   userdata: {totalinvoice:240.00, tax:40.00},

·   rows : [

·     {id:"1", cell:["cell11", "cell12", "cell13"]},

·     {id:"2", cell:["cell21", "cell22", "cell23"]},

·     ...

·   ]

· }

在客户端我们可以有下面两种方法得到这些额外信息:

1.      jQuery("grid_id").getGridParam('userData')

2.      jQuery("grid_id").getUserData()

3.      jQuery("grid_id").getUserDataItem( key )

Jqgrid学习 -------事件

· var lastSel;

· jQuery("#gridid").jqGrid({

· ...

·    onSelectRow: function(id){

·       if(id && id!==lastSel){

·          jQuery('#gridid').restoreRow(lastSel);

·          lastSel=id;

·       }

·       jQuery('#gridid').editRow(id, true);

·    },

· ...

· })

Jqgrid学习 -------方法

jqGrid的方法,从3.6开始已经完全兼容jQuery UI库。

jQuery("#grid_id").jqGridMethod( parameter1,...parameterN );

jQuery("#grid_id").setGridParam({...}).hideCol("somecol").trigger("reloadGrid");

如果使用新的API:

jQuery("#grid_id").jqGrid('method', parameter1,...parameterN );

jQuery("#grid_id").jqGrid('setGridParam',{...}).jqGrid('hideCol',"somecol").trigger("reloadGrid");

jqGrid配置使用新的api

· <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

· <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

· <head>

· <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

· <title>My First Grid</title>

·

· <link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.7.1.custom.css" />

· <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

·

· <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>

· <script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>

· <script type="text/javascript">

·     jQuery.jgrid.no_legacy_api = true;

· </script>

· <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

·

· </head>

· <body>

· ...

· </body>

· </html>

jqGrid的通用方法和设置 
这些方法并不和jqGrid对象绑定,可以随意使用:

Jqgrid学习 -------配置 json

IE8,FF3以及Chrome 3已经支持JSON,配置:

· <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

· <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

· <head>

· <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

· <title>My First Grid</title>

·

· <link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.7.1.custom.css" />

· <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

·

· <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>

· <script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>

· <script type="text/javascript">

·     jQuery.jgrid.useJSON = true;

· </script>

· <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

·

· </head>

· <body>

· ...

· </body>

· </html>

这段代码要放到语言包之后jqGrid.js文件之前。 
如果浏览器不支持JSON,那么我们只能用eval函数解析json。

除了jqGrid本身提供对json的类库外,我们可以使用JSON.parse来处理JSON,配置如下:

· <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

· <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

· <head>

· <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

· <title>My First Grid</title>

·

· <link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.7.1.custom.css" />

· <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

·

· <script src="js/json2.js" type="text/javascript"></script>

· <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>

· <script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>

· <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

· <script type="text/javascript">

·    jQuery.extend(jQuery.jgrid,{

·       parse:function(jsstring) {

·          return JSON.parse(jsstring);

·       }

·    });

· </script>

·

· </head>

· <body>

· ...

· </body>

· </html>

Jqgrid学习 -------翻页

jqGrid的翻页要定义在html里,通常是在grid的下面,且是一个div对象:

· <table id="list"></table>

·    <div id="gridpager"></div>

· jQuery("#grid_id").jqGrid({

· ...

·    pager : '#gridpager',

· ...

· });

不必给翻页设置任何的css属性。在jqGrid里定义的翻页可以是::pager : '#gridpager', pager : 'gridpager' or pager : jQuery('#gridpager'). 推荐使用前两个,当使用其他方式时jqGrid的导入导出功能时会引起错误。

导航栏的属性:

· $.jgrid = {

·     defaults : {

·         recordtext: "View {0} - {1} of {2}",

·             emptyrecords: "No records to view",

·         loadtext: "Loading...",

·         pgtext : "Page {0} of {1}"

·     },

· ...

· }

如果想改变这些设置:

1.   jQuery.extend(jQuery.jgrid.defaults,{emptyrecords: "Nothing to display",...});

2.    jQuery("#grid_id").jqGrid({

...

pager : '#gridpager',

emptyrecords: "Nothing to display",

...

});

导航栏的属性:

jQuery("#grid_id").setGridParam({rowNum:10}).trigger("reloadGrid");

跟翻页相关的事件只有一个:onPaging

jqGrid的翻页导航是一个方法,你可以事先定义一些其他操作,比如:编辑、新增、删除及搜索。也可以增加自定义的函数。导航工具栏是定义到翻页控件上的。定义如下:

· <body>

· ...

·    <table id="list"></table>

·    <div id="gridpager"></div>

· ...

· </body>

· jQuery("#grid_id").jqGrid({

· ...

·    pager : '#gridpager',

· ...

· });

· jQuery("#grid_id").navGrid('#gridpager',{parameters},prmEdit, prmAdd, prmDel, prmSearch, prmView);

· jQuery("#grid_id").jqGrid({

· ...

·    pager : '#gridpager',

· ...

· });

· jQuery("#grid_id").jqGrid('navGrid','#gridpager',{parameters},prmEdit, prmAdd, prmDel, prmSearch, prmView);

· jQuery("#grid_id").jqGrid({

· ...

·    pager : '#gridpager',

· ...

· }).navGrid('#gridpager',{parameters}, prmEdit, prmAdd, prmDel, prmSearch, prmView);

· ...

grid_id :表格id 
gridpager :导航栏id 
parameters :参数列表 
prmEdit, prmAdd, prmDel, prmSearch, prmView :事件

· $.jgrid = {

· ...

·    search : {

·      caption: "Search...",

·      Find: "Find",

·      Reset: "Reset",

·      odata : ['equal', 'not equal', 'less', 'less or equal','greater','greater or equal', 'begins with','does not begin with','is in','is not in','ends with','does not end with','contains','does not contain'],

·      groupOps: [ { op: "AND", text: "all" }, { op: "OR", text: "any" } ],

·      matchText: " match",

·      rulesText: " rules"

·    },

·    edit : {

·      addCaption: "Add Record",

·      editCaption: "Edit Record",

·      bSubmit: "Submit",

·      bCancel: "Cancel",

·      bClose: "Close",

·      saveData: "Data has been changed! Save changes?",

·      bYes : "Yes",

·      bNo : "No",

·      bExit : "Cancel",

·   },

·   view : {

·     caption: "View Record",

·     bClose: "Close"

·   },

·   del : {

·     caption: "Delete",

·     msg: "Delete selected record(s)?",

·     bSubmit: "Delete",

·     bCancel: "Cancel"

·   },

·   nav : {

·     edittext: "",

·     edittitle: "Edit selected row",

·     addtext:"",

·     addtitle: "Add new row",

·     deltext: "",

·     deltitle: "Delete selected row",

·     searchtext: "",

·     searchtitle: "Find records",

·     refreshtext: "",

·     refreshtitle: "Reload Grid",

·     alertcap: "Warning",

·     alerttext: "Please, select row",

·     viewtext: "",

·     viewtitle: "View selected row"

·   },

jQuery("#grid_id").jqGrid({

· ...

·    pager : '#gridpager',

· ...

· }).navGrid('#gridpager',{view:true, del:false},

· {}, // use default settings for edit

· {}, // use default settings for add

· {},  // delete instead that del:false we need this

· {multipleSearch : true}, // enable the advanced searching

· {closeOnEscape:true} /* allow the view dialog to be closed when user press ESC key*/

· );

Jqgrid学习 -------自定义按钮

jQuery("#grid_id").navGrid("#pager",...).navButtonAdd("#pager",{parameters});

jQuery("#grid_id").jqGrid('navGrid',"#pager",...).jqGrid('navButtonAdd',"#pager",{parameters});

{ caption:"NewButton", buttonicon:"ui-icon-newwin", onClickButton:null, position: "last", title:"", cursor: "pointer"}

caption:按钮名称,可以为空,string类型 
buttonicon:按钮的图标,string类型,必须为UI theme图标 
onClickButton:按钮事件,function类型,默认null 
position:first或者last,按钮位置 
title:string类型,按钮的提示信息 
cursor:string类型,光标类型,默认为pointer 
id:string类型,按钮id

如果设置多个按钮:

· jQuery("#grid_id")

· .navGrid('#pager',{edit:false,add:false,del:false,search:false})

· .navButtonAdd('#pager',{

·    caption:"Add",

·    buttonicon:"ui-icon-add",

·    onClickButton: function(){

·      alert("Adding Row");

·    },

·    position:"last"

· })

· .navButtonAdd('#pager',{

·    caption:"Del",

·    buttonicon:"ui-icon-del",

·    onClickButton: function(){

·       alert("Deleting Row");

·    },

·    position:"last"

· });

按钮间的分隔

jQuery("#grid_id").navGrid("#pager",...).navButtonAdd("#pager",{parameters}).navSeparatorAdd("#pager",{separator_parameters}};

默认参数:

{sepclass : “ui-separator”,sepcontent: ''}

sepclass:ui-jqgrid的属性名 
sepcontent:分隔符的内容.

Jqgrid学习 -------格式化

jqGrid的格式化是定义在语言包中

· $jgrid = {

· ...

·    formatter : {

·      integer : {thousandsSeparator: " ", defaultValue: '0'},

·      number : {decimalSeparator:".", thousandsSeparator: " ", decimalPlaces: 2, defaultValue: '0.00'},

·      currency : {decimalSeparator:".", thousandsSeparator: " ", decimalPlaces: 2, prefix: "", suffix:"", defaultValue: '0.00'},

·      date : {

·        dayNames: [

·          "Sun", "Mon", "Tue", "Wed", "Thr", "Fri", "Sat",

·          "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"

·        ],

·        monthNames: [

·          "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",

·          "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"

·        ],

·        AmPm : ["am","pm","AM","PM"],

·        S: function (j) {return j < 11 || j > 13 ? ['st', 'nd', 'rd', 'th'][Math.min((j - 1) % 10, 3)] : 'th'},

·        srcformat: 'Y-m-d',

·        newformat: 'd/m/Y',

·        masks : {

·          ISO8601Long:"Y-m-d H:i:s",

·          ISO8601Short:"Y-m-d",

·          ShortDate: "n/j/Y",

·          LongDate: "l, F d, Y",

·          FullDateTime: "l, F d, Y g:i:s A",

·          MonthDay: "F d",

·          ShortTime: "g:i A",

·          LongTime: "g:i:s A",

·          SortableDateTime: "Y-m-d\\TH:i:s",

·          UniversalSortableDateTime: "Y-m-d H:i:sO",

·          YearMonth: "F, Y"

·        },

·        reformatAfterEdit : false

·      },

·      baseLinkUrl: '',

·      showAction: '',

·      target: '',

·      checkbox : {disabled:true},

·      idName : 'id'

·    }

· ...

这些设置可以通过colModel中的formatoptions参数修改

· jQuery("#grid_id").jqGrid({

· ...

·    colModel : [

·    ...

·       {name:'myname', ... formatter:'number', ...},

·    ...

·    ],

· ...

· });

此实例是对名为“myname”的列进行格式化,格式化类是“number”,假如初始值为“1234.1”则格式化后显示为“1 234.10” 。

如果给某列进行格式化:

· jQuery("#grid_id").jqGrid({

· ...

·    colModel : [

·    ...

·       {name:'myname', ... formatter:'currency', formatoptions:{decimalSeparator:",", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$ "} } ,

·    ...

·    ],

· ...

· });

这个设置会覆盖语言包中的设置。

select类型的格式化实例:

原始数据

· jQuery("#grid_id").jqGrid({

· ...

·    colModel : [ {name:'myname', edittype:'select', editoptions:{value:"1:One;2:Two"}} ... ],

· ...

· });

使用格式化后

· jQuery("#grid_id").jqGrid({

· ...

·    colModel : [ {name:'myname', edittype:'select', formatter:'select', editoptions:{value:"1:One;2:Two"}} ... ]

· ...

· });

结果是,表格的数据值为1或者2但是现实的是One或者Two。

对超链接使用select类型的格式化:

· jQuery("#grid_id").jqGrid({

· ...

·    colModel: [ {name:'myname', edittype:'select', formatter:'select', formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit'}, ...}

·       ...

·    ]

· ...

· });

得到http://localhost/someurl.php?id=123&action=edit

如果想改变id值则

· jQuery("#grid_id").jqGrid({

· ...

·    colModel: [ {name:'myname', edittype:'select', formatter:'select', formatoptions:{baseLinkUrl:'someurl.php', addParam: '&action=edit', idName:'myid'}, ...}

·       ...

·    ]

· ...

· });

得到http://localhost/someurl.php?myid=123&action=edit

Jqgrid学习 -------自定义格式化

· jQuery("#grid_id").jqGrid({

· ...

·    colModel: [

·       ...

·       {name:'price', index:'price', width:60, align:"center", editable: true, formatter:currencyFmatter},

·       ...

·    ]

· ...

· });

·

· function currencyFmatter (cellvalue, options, rowObject)

· {

·    // do something here

·    return new_format_value

· }

cellvalue:要被格式化的值 
options:对数据进行格式化时的参数设置,格式为: 
{ rowId: rid, colModel: cm} 
rowObject:行数据

数据的反格式化跟格式化用法相似.

· jQuery("#grid_id").jqGrid({

· ...

·    colModel: [

·       ...

·       {name:'price', index:'price', width:60, align:"center", editable: true, formatter:currencyFmatter, unformat:unformatCurrency},

·       ...

·    ]

· ...

· });

·

· function currencyFmatter (cellvalue, options, rowObject)

· {

·

·    return "$"+cellvalue;

· }

· function  unformatCurrency (cellvalue, options)

· {

·

·    return cellvalue.replace("$","");

· }

表格中数据实际值为123.00,但是显示的是$123.00; 我们使用getRowData ,getCell 方法取得的值是123.00。 
创建通用的格式化函数

· <script type="text/javascript">

· jQuery.extend($.fn.fmatter , {

·     currencyFmatter : function(cellvalue, options, rowdata) {

·     return "$"+cellvalue;

· }

· });

· jQuery.extend($.fn.fmatter.currencyFmatter , {

·     unformat : function(cellvalue, options) {

·     return cellvalue.replace("$","");

· }

· });

·

· </script>

具体使用:

· jQuery("#grid_id").jqGrid({

· ...

·    colModel: [

·       ...

·       {name:'price', index:'price', width:60, align:"center", editable: true, formatter:currencyFmatter},

·       ...

·    ]

· ...

· })

Jqgrid学习 -------搜索

表格中所有的列都可以作为搜索条件。 
所用到的语言包文件

· $.jgrid = {

· ...

·    search : {

·      caption: "Search...",

·      Find: "Find",

·      Reset: "Reset",

·      odata : ['equal', 'not equal', 'less', 'less or equal','greater','greater or equal', 'begins with','does not begin with','is in','is not in','ends with','does not end with','contains','does not contain'],

·      groupOps: [ { op: "AND", text: "all" }, { op: "OR", text: "any" } ],

·      matchText: " match",

·      rulesText: " rules"

·    }

· jQuery("#grid_id").jqGrid({

· ...

·    colModel: [

·       ...

·       {name:'price', index:'price', width:60, search:true, stype:'text', searchoptions:{dataInit:datePick, attr:{title:'Select Date'}} },

·       ...

·    ]

· ...

· });

· datePick = function(elem)

· {

·    jQuery(elem).datepicker();

· }

需要说明的: 
所有的搜索都是使用url来到服务器端查询数据。 
当执行搜索时会用查询数据填充postData array 
发送到服务器端搜索字符串的名称为_search 
当点击刷新按钮时不会使用搜索条件 
每个搜索方法都有自己的数据清空方法

Jqgrid学习 -------搜索工具栏

搜索工具栏只是在列标题下面构造一个输入框。且使用表格的url进行搜索记录,发到服务器端数据格式为name:value,而且是附加在postData之后。

jQuery("#grid_id").filterToolbar(options);

jQuery("#grid_id").jqGrid('filterToolbar',options);

Jqgrid学习 -------自定义搜索

<div id="mysearch"></div>

jQuery("#mysearch").filterGrid('#grid_id',options);

options:参数

jqGrid简述的更多相关文章

  1. jqgrid 同列不同行的<select>不相同

    如图下所示: 简述原理:设置好表格 所需的字段变量以及字段属性,从后台获取j数据后,在js文件中把数据组合成json格式的字符串,利用字段属性把json数据转换成select,就能实现同列不同行sel ...

  2. jqgrid 单元格放超链接文本

    .前台 <%-- builed by manage.aspx.cmt [ver:] at // :: --%> <%@ Page Language="C#" Au ...

  3. 简述 OAuth 2.0 的运作流程

    本文将以用户使用 github 登录网站留言为例,简述 OAuth 2.0 的运作流程. 假如我有一个网站,你是我网站上的访客,看了文章想留言表示「朕已阅」,留言时发现有这个网站的帐号才能够留言,此时 ...

  4. JavaScript单线程和浏览器事件循环简述

    JavaScript单线程 在上篇博客<Promise的前世今生和妙用技巧>的开篇中,我们曾简述了JavaScript的单线程机制和浏览器的事件模型.应很多网友的回复,在这篇文章中将继续展 ...

  5. Design Patterns Simplified - Part 3 (Simple Factory)【设计模式简述--第三部分(简单工厂)】

    原文链接:http://www.c-sharpcorner.com/UploadFile/19b1bd/design-patterns-simplified-part3-factory/ Design ...

  6. jqGrid合并表头

    jqGrid是一款常用的制表软件,最近开发刚好用到.记录一下常用功能留着以后查找顺便发扬一下开源精神. 二级表头是一种经常会碰到的需求,很多时候为了方便查找需要在原有的表头上再加一层,区分表格不同列的 ...

  7. jqGrid插件getCol方法的一个改进

    jgGrid插件是非常常用的一个基于jQuery的表格插件,功能非常强大.我最近也频繁使用.但是这个插件也有一些不够完善的地方.比如这个getCol方法. getCol方法接受三个参数 colname ...

  8. jqgrid+bootstrap样式实践

    jqgrid+bootstrap样式实践,报错数据加载,选中,删除等功能 需要引入的样式 bootstrap.min.css ui.jqgrid.css 需要引入的JS jquery.min.js b ...

  9. jqGrid jqGrid分页参数+条件查询

    HTML <div class="row"> <div class="col-sm-20"> <form id="for ...

随机推荐

  1. UIKit控件直接显示网页文字内容

    NSString *html = @"<bold>Hello</bold> Now<br> <em>iOS</em> can cr ...

  2. jquer 带左右按钮滚动图片 点击显示大图

    <style> ul{ list-style:none; padding:0px; margin:0px;} li{ list-style:none; padding:0px; margi ...

  3. postgresql 在linux上的源码安装

    http://my.oschina.net/hippora/blog/375292 下载源码并解压 [root@fnddb ~]# wget https://ftp.postgresql.org/pu ...

  4. hdu1285 确定比赛名次(拓扑排序)

    确定比赛名次 Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) Total Submis ...

  5. android sql Cursor

    Cursor 是每行的集合. 使用 moveToFirst() 定位第一行. 你必须知道每一列的名称.你必须知道每一列的数据类型.Cursor 是一个随机的数据源. 所有的数据都是通过下标取得. Cu ...

  6. 转:selenium webdriver 执行javascript代码

    在用selenium webdriver 编写web页面的自动化测试代码时,可能需要执行一些javascript代码,selenium本身就支持执行js,我们在代码中import org.openqa ...

  7. 用cas来实现php的单点登陆

    最近项目中需要做单点登录,客户端包含Java.ruby和PHP,java有几个应用程序,php是discuz+supesite+ucenter,配置步骤如下: 1.cas服务端:下载地址:http:/ ...

  8. opencv ,亮度调整【【OpenCV入门教程之六】 创建Trackbar & 图像对比度、亮度值调整

    http://blog.csdn.net/poem_qianmo/article/details/21479533 [OpenCV入门教程之六] 创建Trackbar & 图像对比度.亮度值调 ...

  9. [学习opencv]高斯、中值、均值、双边滤波

    http://www.cnblogs.com/tiandsp/archive/2013/04/20/3031862.html [学习opencv]高斯.中值.均值.双边滤波 四种经典滤波算法,在ope ...

  10. [转]PHP经验——PHPDoc PHP注释的标准文档

    文档翻译自:http://en.wikipedia.org/wiki/Phpdoc 标记 用途 描述 @abstract   抽象类的变量和方法 @access public, private or ...