1 http://www.360doc.com/content/17/0719/15/9200790_672577533.shtml
2 /*******************************************
3 * Description:
4 * 自定义jqGrid编辑功能，当行获取焦点时编辑，失去焦点时保存
5 *
6 * 调用方法：
7 * 在jGrid的(opts参数中)"editurl"属性的上面或下面添加属性 customEdit: true
8 *
9 * Author:
10 *******************************************/
11 var JqGridCustomEdit = {
12 _cacheName: "editGrid_PrevRowKey",
13 _saveBtnName: "editGrid_BtnSave",
14
15 init: function (gridID) {
16 //this.createSaveButton(gridID);
17 this.createRowBlurEvent(gridID);
18 },
19
20 createSaveButton: function (gridID) {
21 var self = this;
22 var saveBtnID = gridID + "_" + self._saveBtnName;
23 var htmlButton = '<input type="button" id="' + saveBtnID + '" onClick="JqGridCustomEdit._saveData(\'' + gridID + '\')" style="display:none" value="saveRow" />';
24 $("body").append(htmlButton);
25 },
26
27 createRowBlurEvent: function (gridID) {
28 var self = this;
29 $("body").bind("click", function (event) {
30 self.onRowBlur(gridID, event);
31 });
32 },
33
34 onSave: function (gridID) {
35 var saveBtnID = gridID + "_" + this._saveBtnName;
36 $("#" + saveBtnID).click();
37 },
38 showEditCss: function (gridID, show) {
39 if (show) {
40 $("#" + gridID + "_ilsave").removeClass('ui-state-disabled');
41 $("#" + gridID + "_ilcancel").removeClass('ui-state-disabled');
42 $("#" + gridID + "_iladd").addClass('ui-state-disabled');
43 $("#" + gridID + "_iledit").addClass('ui-state-disabled');
44 }
45 else {
46 $("#" + gridID + "_ilsave").addClass('ui-state-disabled');
47 $("#" + gridID + "_ilcancel").addClass('ui-state-disabled');
48 $("#" + gridID + "_iladd").removeClass('ui-state-disabled');
49 $("#" + gridID + "_iledit").removeClass('ui-state-disabled');
50 }
51 },
52 onSelectRow: function (gridID, rowid) {
53 var self = this;
54 var rowKeyCacheID = gridID + "_" + self._cacheName;
55 var prevRowKey = $("body").data(rowKeyCacheID);
56
57 $("body").data(rowKeyCacheID, rowid);
58
59 JqGridFormatCell.beforEditRow(gridID, rowid);
60 $("#" + gridID).jqGrid("editRow", rowid, $("#" + gridID).get(0).p.editParams);
61 self.showEditCss(gridID, true);
62 },
63
64 onRowBlur: function (gridID, event) {
65 var haveEditRow = false;
66 $("#" + gridID).find("tr").each(function () {
67 if ($(this).attr("editable") == "1") {
68 haveEditRow = true;
69 return false;
70 }
71 });
72
73 if (haveEditRow) {
74 var self = this;
75 var rowid = $("#" + gridID).jqGrid('getGridParam', 'selrow');
76 if (rowid == null) { return; }
77
78 var eventObj = ((event.srcElement) ? event.srcElement : event.target);
79 var prev = false;
80 var next = false;
81 var pClass = $(eventObj).parent().attr("class");
82 var nClass = $(eventObj).parent().attr("class");
83 if (pClass) prev = pClass.indexOf("ui-datepicker-prev") != -1;
84 if (nClass) next = nClass.indexOf("ui-datepicker-next") != -1;
85 if ($("#ui-datepicker-div").find(eventObj).length > 0 || prev || next) { return; }
86
87 if (eventObj.tagName == "TD") {
88 var currgriddom = $("#" + gridID).find(eventObj).length;
89 if (currgriddom == 0) {
90 self._saveData(gridID);
91 }
92 // var $eventTR = $(eventObj).parent();
93 // if ($eventTR.attr("id") != rowid) {
94 // self._saveData(gridID);
95 // }
96 }
97 else if (eventObj.tagName == "INPUT" || eventObj.tagName == "SELECT" || eventObj.tagName == "OPTION") {
98 var rid = $(eventObj).attr("id");
99 if (rid && rid.indexOf(rowid) == -1) {
100 self._saveData(gridID);
101 }
102 }
103 else {
104 self._saveData(gridID);
105 }
106 }
107 },
108
109 _saveData: function (gridID) {
110 var self = this;
111 var rowKeyCacheID = gridID + "_" + self._cacheName;
112
113 var rowid = $("body").data(rowKeyCacheID);
114 if (rowid == null) {
115 return false;
116 }
117 if (rowid == "new_row" && $("#" + rowid).attr("class").indexOf("jqgrid-new-row") != -1) {
118 $("#" + gridID).jqGrid('saveRow', rowid, $("#" + gridID).get(0).p.addParams);
119 } else {
120 $("#" + gridID).jqGrid('saveRow', rowid, $("#" + gridID).get(0).p.editParams);
121 }
122 self.showEditCss(gridID, false);
123 // $("#" + gridID).jqGrid('saveRow', rowid, function (result) {
124 // self.showEditCss(gridID, false);
125 // if (result.responseText == "") {
126 // //$.jAlert("Update is missing!");
127 // return false;
128 // } else {
129 // $("body").removeData(rowKeyCacheID);
130 // //$.jAlert("Update is successful");
131 // return true;
132 // }
133 // });
134 }
