前台代码
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="jquery.jqGrid-4.3.1/css/ui.jqgrid.css" rel="stylesheet" type="text/css" />
<script src="jquery.jqGrid-4.3.1/js/jquery-1.5.2.min.js" type="text/javascript"></script>
<script src="jquery.jqGrid-4.3.1/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="jquery.jqGrid-4.3.1/js/jquery.jqGrid.src.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/flick/jquery-ui.css" />
<script type="text/javascript">
$(function () {
var subid;
var subPagerid;
jQuery("#sg1").jqGrid({
url: "Handler.ashx?q=1&id=0",
datatype: "json",
height: 300,
width: 600,
colNames: ['姓名', 'group1', '时间'],
colModel: [
{ name: 'name', index: 'name', width: 55, editable: true, edittype: "text" },
{ name: 'group11', index: 'group1', width: 90, editable: true, edittype: "text" },
{ name: 'time', index: 'time', width: 100, editable: true, edittype: "text" }
],
rowNum: 8,
editurl: "Handler.ashx?q=1&id=0", //编辑 ajax请求的url
rowList: [8, 10, 20, 30],
pager: '#psg1',
sortname: 'name',
viewrecords: true,
sortorder: "desc",
multiselect: false,
subGrid: true,
caption: "请假申请单",
jsonReader: {
root: "rows",
total: "total",
repeatitems: false
},
onSelectRow: function (id) {
if (id && id !== lastsel) {
lastsel = id;
// jQuery('#sg1').jqGrid('restoreRow', lastsel); //lastsel是编辑第几行的行数
jQuery('#sg1').jqGrid('editRow', id, true); //行内编辑
}
},
// define the icons in subgrid
subGridOptions: {
"plusicon": "ui-icon-triangle-1-e",
"minusicon": "ui-icon-triangle-1-s",
"openicon": "ui-icon-arrowreturn-1-e",
// load the subgrid data only once
// and the just show/hide
"reloadOnExpand": false,
// select the row when the expand column is clicked
"selectOnExpand": true
},
subGridRowExpanded: function (subgrid_id, row_id) {
var subgrid_table_id, pager_id;
subgrid_table_id = subgrid_id + "_t";
subid = subgrid_table_id;
pager_id = "p_" + subgrid_table_id;
$("#" + subgrid_id).html("<table id='" + subgrid_table_id + "' class='scroll'></table><div id='" + pager_id + "' class='scroll'></div>");
jQuery("#" + subgrid_table_id).jqGrid({
url: "Handler.ashx?q=2&;
}
context.Response.Write(resp);
}
public bool IsReusable
{
get
{
return false;
}
}
}