HTML代码举例
<html> <head> <title>jqGrid 实例</title> </head> <body> ···代码省略··· <table id="list1"></table> <div id="pager1"></div> ···代码省略··· </body> </html>
javascript代码举例
$(function(){ pageInit(); }); function pageInit(){ $("#list1").jqGrid( { url : ctx+'/XMLData', datatype : "xml", colNames : [ 'Inv No', 'Date', 'Client', 'Amount', 'Tax','Total', 'Notes' ], colModel : [ {name : 'id',index : 'id',width : 75}, {name : 'invdate',index : 'invdate',width : 90}, {name : 'name',index : 'name',width : 100}, {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} ], rowNum : 10, autowidth : true, rowList : [ 10, 20, 30 ], pager : jQuery('#pager1'), mtype : "post", sortname : 'id', viewrecords : true, sortorder : "desc", caption : "XML 实例" }).navGrid('#pager1', { edit : false, add : false, del : false }); }
java servlet代码举例
public class XMLData extends HttpServlet { private static final long serialVersionUID = 1L; /** * @see HttpServlet#HttpServlet() */ public XMLData() { super(); // TODO Auto-generated constructor stub } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub String xml = "<?xml version='1.0' encoding='utf-8'?>" + "<rows>" + " <page>1</page>" + " <total>2</total>" + " <records>13</records>" + " <userdata name='tamount'>3820.00</userdata>" + " <userdata name='ttax'>462.00</userdata>" + " <userdata name='ttotal'>4284.00</userdata>" + " <row id='13'>" + " <cell>13</cell>" + " <cell>2007-10-06</cell>" + " <cell><![CDATA[Client 3]]>" + " </cell><cell>1000.00</cell>" + " <cell>0.00</cell>" + " <cell>1000.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='12'>" + " <cell>12</cell>" + " <cell>2007-10-06</cell>" + " <cell><![CDATA[Client 2]]></cell>" + " <cell>700.00</cell>" + " <cell>140.00</cell>" + " <cell>840.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='11'>" + " <cell>11</cell>" + " <cell>2007-10-06</cell>" + " <cell><![CDATA[Client 1]]></cell>" + " <cell>600.00</cell>" + " <cell>120.00</cell>" + " <cell>720.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='10'>" + " <cell>10</cell>" + " <cell>2007-10-06</cell>" + " <cell><![CDATA[Client 2]]></cell>" + " <cell>100.00</cell>" + " <cell>20.00</cell>" + " <cell>120.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='9'>" + " <cell>9</cell>" + " <cell>2007-10-06</cell>" + " <cell><![CDATA[Client 1]]></cell>" + " <cell>200.00</cell>" + " <cell>40.00</cell>" + " <cell>240.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='8'>" + " <cell>8</cell>" + " <cell>2007-10-06</cell>" + " <cell><![CDATA[Client 3]]></cell>" + " <cell>200.00</cell>" + " <cell>0.00</cell>" + " <cell>200.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='7'>" + " <cell>7</cell>" + " <cell>2007-10-05</cell>" + " <cell><![CDATA[Client 2]]></cell>" + " <cell>120.00</cell>" + " <cell>12.00</cell>" + " <cell>134.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='6'>" + " <cell>6</cell>" + " <cell>2007-10-05</cell>" + " <cell><![CDATA[Client 1]]></cell>" + " <cell>50.00</cell>" + " <cell>10.00</cell>" + " <cell>60.00</cell>" + " <cell><![CDATA[]]></cell>" + " </row>" + " <row id='5'>" + " <cell>5</cell>" + " <cell>2007-10-05</cell>" + " <cell><![CDATA[Client 3]]></cell>" + " <cell>100.00</cell>" + " <cell>0.00</cell>" + " <cell>100.00</cell>" + " <cell><![CDATA[no tax at all]]></cell>" + " </row>" + " <row id='4'>" + " <cell>4</cell>" + " <cell>2007-10-04</cell>" + " <cell><![CDATA[Client 3]]></cell>" + " <cell>150.00</cell>" + " <cell>0.00</cell>" + " <cell>150.00</cell>" + " <cell><![CDATA[no tax]]></cell>" + " </row>" + "</rows>"; response.getWriter().write(xml); } }