jqGrid说明.doc

jqGrid包说明: ? jquery.js is the jQuery library, ? jquery.jqGrid.js 主单元，包含的功能取决您的选择 grid.basic.js 主插件，其他插件包依赖于该插件正常运行 ? grid.custom.js Grid高级插件功能包 ? grid.formedit.js 用于表格编辑、增加、删除功能 ? grid.inlinedit.js 线条编辑 ? grid.subgrid.js一个处理表格的插件 ? grid.postext.js 一个可以用来操作post数据的包 ? jqModal.js 模态对话框的编辑 ? jqDnR.js可拖拉的表格编辑 ? themes 包含gird需要的样式表 功能描述： jqGrid包主要用于将需要展示的数据动态的展示在页面的上，即动态画出表格，并封装了增、删、改、查、分类显示、在线编辑修改等功能。 关键使用说明： 导入jqGrid包，在首页属性里面添加如下包的信息 link rel=\stylesheet\ type=\text/css\ media=\screen\ href=\/SedSoft/jqGrid/themes/basic/grid.css\ link rel=\stylesheet\ type=\text/css\ media=\screen\ href=\/SedSoft/jqGrid/themes/jqModal.css\ script type=\text/javascript\ src=\/sedsoft/jqGrid/jquery.js\ /script script type=\text/javascript\ src=\/sedsoft/jqGrid/jquery.jqGrid.js\ /script script type=\text/javascript\ src=\/sedsoft/jqGrid/js/jqModal.js\ /script script type=\text/javascript\ src=\/sedsoft/jqGrid/js/jqDnR.js\ /script 注：由于加载js包 会耗费大量资源，建议动态加载这些js包，优化页面初始化效率。 在页面上需要添加表格的地方， 增加 table id=list class=scroll/table div id=pager class=scroll style=text-align:center;/div /body list表格id，pager为表格导航条id 写jqGrid函数 jQuery(document).ready(function(){ jQuery(#list).jqGrid({ url:example.php, datatype: xml, mtype: GET, colNames:[Inv No,Date, Amount,Tax,Total,Notes], colModel :[ {name:invid, index:invid, width:55}, {name:invdate, index:invdate, width:90}, {name:amount, index:amount, width:80, align:right}, {name:tax, index:tax, width:80, align:right}, {name:total, index:total, width:80, align:right}, {name:note, index:note, width:150, sortable:false} ], pager: jQuery(#pager), rowNum:10, rowList:[10,20,30], sortname: id, sortorder: desc, viewrecords: true, imgpath: themes/basic/images, caption: My first grid }); }); 以上代码基本可以将要展示的表格展示出来了，现在对一些属性说明： jQuery(“#list”).jqGrid list为将要显示表格的table 的id altRows : 设置表格显示斑马条纹属性，默认值为true caption: 定义表格标题名 cellEdit： 设置表格单元是否可以编辑，默认值为true，详见cellEdit介绍 cellsubmit: 决定cell容器如何被保存，使用’remote’或者‘clientArray’，详见cellEdit cellurl: 处理cell编辑的