jqGrid 装配
jqGrid 安装Google下jqGrid download,当前的下载地址是:http://www.trirand.com/blog/?page_id6勾选所选
jqGrid 安装
Google下jqGrid download,当前的下载地址是:http://www.trirand.com/blog/?page_id=6
勾选所选的功能包,下载即可。
下载后的压缩包中有一个install的txt文件,说明了如何安装,十分简单。
前提条件是安装jQuery和jQuery UI。jqGrid是基于前两个开发的。
?
jqGrid安装很简单,只需把相应的css、js文件加入到页面中即可。 (不同于Ext,jqGrid的CSS和JS文件可以分开放置)
按照官网文档:?
??? *?
????? /myproject/css/?
????????? o?
??????????? ui.jqgrid.css?
????????? o?
??????????? /ui-lightness/?
??????????????? +?
????????????????? /images/?
??????????????? +?
????????????????? jquery-ui-1.7.2.custom.css?
??? *?
????? /myproject/js/?
????????? o?
??????????? /i18n/?
??????????????? +?
????????????????? grid.locale-bg.js?
??????????????? +?
????????????????? list of all language files?
??????????????? +?
????????????????? ….?
????????? o?
??????????? Changes.txt?
????????? o?
??????????? jquery-1.3.2.min.js?
????????? o?
??????????? jquery.jqGrid.min.js?
目录结构如上。?
在页面中写法:
Java代码??
- <!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="js/src/css/ui.jqgrid.css"?/>??
- <link?rel="stylesheet"?type="text/css"?media="screen"?href="js/src/css/jquery.searchFilter.css"?/>??
- ???
- <style>??
- html,?body?{??
- ????margin:?0;??
- ????padding:?0;??
- ????font-size:?75%;??
- }??
- </style>??
- ???
- <script?src="js/jquery-1.3.2.min.js"?type="text/javascript"></script>??
- <script?src="js/src/grid.loader.js"?type="text/javascript"></script>??
- ???
- </head>??
- <body>??
- ...??
- </body>??
- </html>??
需要说明的是,jquery-ui的字体大小与jqgrid字体大小不一致,故需要在页面上在加上一段?
style来指定页面上文字大小。