1: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
2:
3: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4: <html xmlns="http://www.w3.org/1999/xhtml">
5: <head runat="server">
6: <title></title>
7: <script src="jquery.jqGrid-4.3.1/js/jquery-1.5.2.min.js" type="text/javascript"></script>
8: <script src="jquery.jqGrid-4.3.1/js/i18n/grid.locale-cn.js" type="text/javascript"></script>
9: <script src="jquery.jqGrid-4.3.1/js/jquery.jqGrid.min.js" type="text/javascript"></script>
10: <link href="jquery.jqGrid-4.3.1/css/ui.jqgrid.css" rel="stylesheet" type="text/css" />
11: <script src="jquery.xml2json.js" type="text/javascript"></script>
12: <script src="Json2String.js" type="text/javascript"></script>
13: <script src="string2json.js" type="text/javascript"></script>
14: <link href="Jquery%20UI/jquery-ui-1.8.18.custom/css/smoothness/jquery-ui-1.8.18.custom.css"
15: rel="stylesheet" type="text/css" />
16: <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/smoothness/jquery-ui.css" />
17: <script type="text/javascript">
18: $(function () {
19:
20: var firstNode = new Array(); //主表字段
21: var secondNode = new Array(); //子表字段
22: var secondNodeParent = new Array(); //有子节点的第一层节点
23: var thirdNode = new Array();
24: var urlCollection=new Array();
25: $.get("dd.xml", function (data) { //获取 字段
26:
27: var fcounter = 0;
28: var scounter = 0;
29: var scounterP = 0;
30: for (var i = 0; i < data.documentElement.childNodes.length; i++) {//第一层
31:
32: var nn = data.documentElement.childNodes[i].tagName;
33: var l = data.documentElement.childNodes[i].childNodes.length;
34: if (typeof (nn) == "undefined") {
35: continue;
36: }
37: else {
38: if (l < 2) {
39: firstNode[fcounter] = nn.replace("my:", "");
40: fcounter += 1;
41: }
42:
43: if (l > 1) {//第二层
44:
45: var j = 0;
46: for (j; j < l; j++) {
47: var sname = data.documentElement.childNodes[i].childNodes[j].tagName;
48: if (typeof (sname) == "undefined") {
49: continue;
50: }
51: else {
52: if (data.documentElement.childNodes[i].childNodes[j].childNodes.length < 2) {//说明没有子节点，就是子表 演展示的数据了
53: secondNodeParent[scounterP] = nn.replace("my:", "");
54: scounterP += 1;
55: secondNode[scounter] = sname.replace("my:", "");
56: scounter += 1;
57: }
58:
59:
60: }
61:
62: }
63: }
64: }
65: }
66: var colModels = new String();
67: //构造模型
68: for (var i = 0; i < firstNode.length; i++) {
69: if (i == 0) {
70: colModels += "[";
71: }
72: if (i != firstNode.length - 1) {
73: colModels += "{" + "name:" + "'" + firstNode[i] + "'," + "index:" + "'" + firstNode[i] + "'}" + ",";
74:
75: }
76: else {
77: colModels += "{" + "name:" + "'" + firstNode[i] + "'," + "index:" + "'" + firstNode[i] + "'}]";
78: }
79: }
80: colModels = eval(colModels);
81:
82:
83:
84:
85:
86: var colName = new Array();
87: for (var i = 0; i < firstNode.length; i++) {
88: colName[i] = firstNode[i];
89:
90: }
91:
92: var sonColName = new Array();
93: for (var i = 0; i < secondNode.length; i++) {
94: sonColName[i] = secondNode[i];
95:
96: }
97:
98: var SonColModels = new String();
99: //构造模型
100: for (var i = 0; i < secondNode.length; i++) {
101: if (i == 0) {
102: SonColModels += "[";
103: }
104: if (i != secondNode.length - 1) {
105: SonColModels += "{" + "name:" + "'" + secondNode[i] + "'," + "index:" + "'" + secondNode[i] + "'}" + ",";
106:
107: }
108: else {
109: SonColModels += "{" + "name:" + "'" + secondNode[i] + "'," + "index:" + "'" + secondNode[i] + "'}]";
110: }
111: }
112: SonColModels = eval(SonColModels);
113:
114: var url = ["dd.xml", "ddd.xml"];
115: //定义 grid
116: var subid;
117: var subPagerid;
118: var lastsel;
119: jQuery("#sg1").jqGrid({
120:
121: datatype: "local",
122: height: "300px",
123: width: "800px",
124: colNames: colName,
125: colModel: colModels,
126: rowNum: 8,
127: // editurl: "Handler.ashx?q=1&id=0", //编辑 ajax请求的url
128: rowList: [8, 10, 20, 30],
129: pager: '#psg1',
130: sortname: 'name',
131: viewrecords: true,
132: sortorder: "desc",
133: multiselect: false,
134: subGrid: true,
135: caption: "主表",
136:
137: // define the icons in subgrid
138: subGridOptions: {
139: "plusicon": "ui-icon-triangle-1-e",
140: "minusicon": "ui-icon-triangle-1-s",
141: "openicon": "ui-icon-arrowreturn-1-e",
142:
143: "reloadOnExpand": false,
144:
145: "selectOnExpand": true
146: },
147: subGridRowExpanded: function (subgrid_id, row_id) {
148:
149: var subgrid_table_id, pager_id;
150: subgrid_table_id = subgrid_id + "_t";
151: subid = subgrid_table_id;
152: pager_id = "p_" + subgrid_table_id;
153: subPagerid = pager_id;
154: $("#" + subgrid_id).html("<table id='" + subgrid_table_id + "' class='scroll'></table><div id='" + pager_id + "' class='scroll'></div>");
155: jQuery("#" + subgrid_table_id).jqGrid({
156: // url: "Handler.ashx?q=2&id=" + row_id + "&ss=" + subgrid_id,
157: datatype: "local",
158: caption: "子表",
159: colNames: sonColName,
160: colModel: SonColModels,
161: rowNum: 20,
162: pager: pager_id,
163: // sortname: 'num',
164: //sortorder: "asc",
165: height: '100%',
166: width: '100%'
167:
168:
169: // editurl: "Handler.ashx" //编辑 ajax请求的url
170: });
171: jQuery("#" + subid).jqGrid('navGrid', '#' + subPagerid, { edit: true, add: true, del: true }, {}, {}, {}, { multipleSearch: true, multipleGroup: true }); //配置多项查询
172:
173: $.get(url[row_id], function (datas) {
174: var data = $.xml2json(datas);
175: var s = $.toJSON(data);
176: while (true) {
177: if (s.indexOf("my:") == -1) {
178: break;
179: }
180: else {
181: s = s.replace("my:", "");
182: }
183: }
184: var JsonObject = eval("[" + s + "]");
185: //var asd = JsonObject[0].preferences.tripClass;
186: var model = new Array();
187: for (var s = 0; s < secondNode.length; s++) {
188:
189: model[s] = eval("JsonObject[0]." + secondNodeParent[0] + "." + secondNode[s]);
190: }
191:
192: var rowDataModel = new String();
193: for (var c = 0; c < firstNode.length; c++) {
194: if (c == 0) {
195: rowDataModel += "{";
196: }
197:
198: if (c != firstNode.length - 1) {
199:
200: rowDataModel += "\"" + secondNode[c] + "\":\"" + model[c] + "\",";
201:
202: }
203: else {
204: rowDataModel += "\"" + secondNode[c] + "\":\"" + model[c] + "\"}";
205: }
206: }
207: rowDataModel = eval("[" + rowDataModel + "]");
208:
209: jQuery("#" + subid).jqGrid("addRowData", 0, rowDataModel);
210: })
211: }
212: });
213: jQuery("#sg1").jqGrid('navGrid', '#psg1', { edit: true, add: true, del: true }, {}, {}, {}, { multipleSearch: true, multipleGroup: true }); //配置多项查询
214: var row = 0;
215: for (var l = 0; l < url.length; l++) {
216: $.get(url[l], function (data) {
217: data = $.xml2json(data);
218: var s = $.toJSON(data);
219: while (true) {
220: if (s.indexOf("my:") == -1) {
221: break;
222: }
223: else {
224: s = s.replace("my:", "");
225: }
226: }
227: // s = s.join("\"\"");
228: var JsonObject = eval("[" + s + "]");
229:
230:
231: var model = new Array();
232: for (var s = 0; s < firstNode.length; s++) {
233:
234: model[s] = eval("JsonObject[0]." + firstNode[s]);
235: }
236:
237: var rowDataModel = new String();
238: for (var c = 0; c < firstNode.length; c++) {
239: if (c == 0) {
240: rowDataModel += "{";
241: }
242:
243: if (c != firstNode.length - 1) {
244:
245: rowDataModel += "\"" + firstNode[c] + "\":\"" + model[c] + "\",";
246:
247: }
248: else {
249: rowDataModel += "\"" + firstNode[c] + "\":\"" + model[c] + "\"}";
250: }
251: }
252: rowDataModel = eval("[" + rowDataModel + "]");
253:
254:
255:
256: jQuery("#sg1").jqGrid("addRowData", row, rowDataModel);
257: row += 1;
258:
259: })
260: }
261:
262: $("#gview_sg1").find("div:eq(1)").addClass("hs");
263: })
264: //get结束
265:
266:
267:
268: })
269: </script>
270: <style type="text/css">
271: .hs
272: {
273: height: 40px;
274: }
275: #gview_sg1 div table thead tr th
276: {
277: height: 40px;
278: }
279: </style>
280: </head>
281: <body>
282: <table id="sg1">
283: </table>
284: <div id="psg1">
285: </div>
286: </body>
287: </html>
156
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
