在datagrid中如何实现让一行进入编辑状态,修改数据后,保存信息呢?
1 //点击列表变成文本框,进入可编辑状态
2
3 $(function () {
4 var doc = $(document),
5 table = $("#divReportTable");
6 doc.on("mousedown", ".btnEdit", function () {
7
8 var th = $(this),
9 ind = th.attr("index"),
10 keyid = th.attr("keyid");
11
12 type = th.attr("type");
13 if (th.hasClass("btnEdit")) {
14 if (type == "edit") {
15
16 table.datagrid("beginEdit", ind);
17 setTimeout(function () {
18 th.html("保存")
19 .attr("type", "sava");
20 var _ele = table.datagrid('getEditors', ind);
21
22
23 })
24 } else if (type == "sava") {
25 var ele = table.datagrid('getEditors', ind);
26
27 table.datagrid("endEdit", ind);//结束编辑
28
29
30
31 @*//执行保存的操作
32 $.ajax({
33 url: '@Url.Action("ActionName", "ControllerName")',
34 data: { "ID": keyid, "Score": Score },
35 type: "POST",
36 async: true,
37 dataType: "json",
38 success: function (result) {
39 if (result.Success == true) {
40 RefreshData()
41 } else {
42 //alert('失败');
43 }
44 }
45 });*@
46 }
47 }
48 })
49
50
51 doc.on("mousedown", ".datagrid-editable-input", function () {
52 //alert('点击了文本框');
53 console.log(this);
54 //PersonSelect('11', '11txt');
55
56 var user = $(this).val();
57 $(this).val(user.UserName);
58
59 });
60
61
62 })
col.push({
title: "操作", field: "Operate", width: 120, align: "center", resizeable: false, formatter: function (value, row, index) {
return "<a href=\"javascript:void(0)\" class='btnEdit' index='" + index + "' keyid='" + row.ID + "' type='edit'>编辑</a>"
}
});
colOne.push({
title: "填报人", field: "FillUser", width: 135, align: "center", resizeable: false, rowspan: rows, formatter: function (value, row) {
return WorkModel.FormateUser(row.FillUser, row.FillUserName, 1, row.ID, fromType);
},
editor: { type: "text" }
});
给列加上editor:{type:"text"} 进入编辑状态后,编辑状态下,这一列将显示成文本框. type：字符串，编辑类型，可选值：text，textarea，checkbox，numberbox，validatebox，datebox，combobox，combotree。