获取数据渲染数据

  • 获取表格全部数据:$('#'+id).jfGridGet('rowdatas');
  • 获取表格选中行数据:$('#'+id).jfGridGet('rowdata');
  • 渲染表格数据: $('#'+id).jfGridSet('refreshdata', data);
  • 刷新表格一行数据 $('#'+id).jfGridSet('updateRow', index);
  • 刷新表格数据 $('#'+id).jfGridSet('reload');
  • 获取选中行某字段值 $('#'+id).jfGridValue('Id');

初始化

方法:$('#'+id).jfGrid(op);
参数说明:

参数 说明 默认
url 数据服务地址
param 请求参数
rowdatas 列表数据
datatype 数据类型 array
headData 表格列数据
isShowNum 是否显示序号 true
isMultiselect 是否允许多选 false
multiselectfield 多选绑定字段
isSubGrid 是否有子表 false
subGridRowExpanded 子表展开后回调函数
subGridHeight 子表高度
onSelectRow 选中一行后回调函数
onRenderComplete 表格加载完后调用
isPage 是否分页 false
sidx 排序字段 ‘’
sord 排序方式 ASC
isTree 是否树形显示(没有分页的情况下才支持) false
mainId 关联的主键 id
parentId 树形关联字段 parentId
reloadSelected 刷新后是否还选择之前选中的,只支持单选 false
isAutoHeight 自动适应表格高度 false
footerrow 底部合计条 false
isEidt 是否编辑 false
minheight 最低高度 0
height 高度 0
onAddRow 添加一行数据后执行 false
onMinusRow 删除一行数据后执行 false
beforeMinusRow 删除一行数据前执行 false
ishide 是否隐藏 false
rows 表格每页行数 100
isStatistics 统计条 false

示例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
$('#LR_DJ_DetaSalary').jfGrid({
headData: [
{
label: 'Material Code', name: 'MaterialNumber', width: 180, align: 'left', frozen: true
, edit: {
type: 'layer',
change: function (rowData, rowIndex, item, seletes) {//seletes为选中行的数据
//获取数据
//如果是选择单行更新当前行数据
if (seletes.length == 1) {
rowData.MaterialNumber = item.FNumber;
rowData.MaterialName = item.FName;
rowData.FMaterialId = item.FMATERIALID;
$('#LR_DJ_DetaSalary').jfGridSet('updateRow', rowIndex);
}
else {//如果是多行直接添加数据
var rows = $('#LR_DJ_DetaSalary').jfGridGet('rowdatas');
var addRows = [];
$.each(seletes, function (i, n) {
rows.push({
MaterialNumber: n.FNumber,
MaterialName: n.FName,
FMaterialId: n.FMATERIALID
});
});
$.each(rows, function (i, item) {
if (item.MaterialNumber != undefined && item.MaterialNumber != '') {
addRows.push(item);
}
});
$('#LR_DJ_DetaSalary').jfGridSet('refreshdata', addRows);
}
},
op: {
width: 700,
height: 500,
colData: [
{ label: "ID", name: "FMATERIALID", width: 100, align: "left", ishide: true },
{ label: "Material Code", name: "FNumber", width: 200, align: "left" },
{ label: "物料名称", name: "FName", width: 100, align: "left" }
],
url: top.$.rootUrl + '/JD_BasicModule/LR_DJ_MrEndCustomer/GetwlZPpany?number=' + data.text + "&companyNumber=" + $("#F_Company").val(),
isPage: true,
reloadSelected: true,
mainId: 'FMATERIALID',
sidx: 'FMATERIALID',
isMultiselect: true,
type: 2
}
}
},
{
label: 'Material Code', name: 'WuLiao', width: 130, align: 'left',
edit: {
type: 'layer',
change: function (rowData, rowIndex, item) {
rowData.WuLiao = item.FNumber;
rowData.WuLiaoName = item.FName;
rowData.F_RTA_HavePPN = item.F_RTA_HavePPN;
rowData.FMaterialId = item.FMATERIALID;
$('#LR_DJ_ExpensePurDetailed').jfGridSet('updateRow', rowIndex);
},
op: {
width: 700,
height: 500,
colData: [
{ label: "ID", name: "FMATERIALID", width: 100, align: "left", ishide: true },
{ label: "Material Code", name: "FNumber", width: 200, align: "left" },
{ label: "物料名称", name: "FName", width: 100, align: "left" }
],
url: top.$.rootUrl + '/JD_BasicModule/LR_DJ_MrEndCustomer/Getdbwlpany?F_RTA_TYPEOFSPF=' + data.text + "&companyNumber=" + $("#F_Company").val(),
isPage: true,
reloadSelected: true,
mainId: 'F_UserId',
sidx: 'FMATERIALID',
type: 1
}
}
},
{
label: '部门', name: 'FDepartmentName', width: 120, align: 'left', bk: '#e0e0e0'
,edit: {
type: 'select',
datatype: 'dataSource',
code: 'YD_JFFS',
op: {
value: 'id',
text: 'designaname',
title: 'designaname'
}
}
},
{
label: '部门编码', name: 'FDepartment', width: 100, align: 'left', ishide: true
, edit: {
type: 'select',
datatype: 'dataItem',
code: 'BZ'
}
},
{
label: '金额', name: 'FMoney', width: 100, align: 'left', statistics: true
, edit: {
type: 'input'
}
},
{
label: '说明', name: 'FExplain', width: 300, align: 'left'
, edit: {
type: 'input',
change: function (rowData, index, $edit) {
if (rowData.FExplain.length > 300) {
$edit.val(rowData.FExplain.substring(0, 300));
rowData.FExplain = $edit.val();
$('#LR_DJ_DetaSalary').jfGridSet('updateRow', index);
}
}
}
},
{
label: '部门ID', name: 'FDepartId', width: 100, align: 'left', ishide: true
},
],
isEdit: true,
height: 200
});

含有子页面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
//表格
$('#gridtable').jfGrid({
url: top.$.rootUrl + '/Fly_TZ/Fly_TZ_Opmaster/GetPageList',
headData: [
{label: "台账号", name: "TZnumber", width: 150, align: "left" },
{ label: "创建人", name: "F_CreateUserName", width: 100, align: "left"
, formatterAsync: function (callback, value, row, op, $cell) {
learun.clientdata.getAsync('custmerData', {
url: '/LR_SystemModule/DataSource/GetDataTable?code=' + 'ZYWHB',
key: value,
keyId: 'portid',
callback: function (_data) {
callback(_data['businesspartnername']);
}
})
}
},
{ label: "业务状态", name: "StateName", width: 100, align: "left"
, formatterAsync: function (callback, value, row, op,$cell) {
learun.clientdata.getAsync('dataItem', {
key: value,
code: '9005',
callback: function (_data) {
callback(_data.text);
}
});
}
}
],
mainId: 'Id',
isPage: true,
sord: "DESC",
sidx: 'F_CreateDate',
isMultiselect: true,
isSubGrid: true,
subGridHeight: 250,
subGridExpanded: function (subid, rowdata) {
var TZId = rowdata.Id;
$('#' + subid).jfGrid({
url: top.$.rootUrl + '/Fly_TZ/Fly_TZ_Opmaster/Expensesubpagelist',
headData: [
{ label: "应收", name: "yingshou", width: 120, align: "left" },
{ label: "应付", name: "yingfu", width: 140, align: "left" },
{ label: "实收", name: "", width: 120, align: "left" },
{ label: "实付", name: "", width: 140, align: "left" },
{ label: "利润", name: "lirun", width: 140, align: "left" },
],
mainId: 'yingshou',
sord: "ASC",
sidx: 'yingshou',
isEdit: true
});
$('#' + subid).jfGridSet('reload', { TZId: TZId });
}// 子表展开后调用函数
});

监听单元格事件

方法: formatter
示例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
{
label: '操作', name: 'caozuo', width: 100, align: 'left'
, formatter: function (cellvalue, row, dfop, $dcell) {
$dcell.on('click',
function () {
top.layer.open({
type: 2,
title: '打印展示',
shadeClose: true,
shade: false,
maxmin: true, //开启最大化最小化按钮
area: ['1000px', '650px'],
content: '/Fly_ZD/Fly_ZD_Head/Print'
});
});
return '<span class="label label-success" style="text-align:center" title="预览">待收支列齐</span>';
}
}

注意:formatter方法必须要有返回值

判断是否选中行

方法:checkrow
示例:

1
2
3
4
var keyValue = $('#gridtable').jfGridValue('Id');
if (learun.checkrow(keyValue)) {

}

表格上传附件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 {
label: '签名',
name: 'EXT11',
width: 100,
align: 'left',
formatter: function (cellvalue, row, dfop, $dcell) {
if (row.EXT1 != undefined && row.EXT1 != null) {
var res = learun.httpGet(
top.$.rootUrl +
'/LR_SystemModule/Annexes/GetFileNames?folderId=' +
row.EXT1);
if (res.code == 200 && res.info != '') {
$dcell.on('click', //对应参数附件列数据,行号,列明
function () {
cellDown(row.EXT1, $dcell.attr("rownum"), 'EXT1');
});
return '<span>查看签名</span>';
}
} else {
$dcell.on('click',
function () {
cellDown(row.EXT1, $dcell.attr("rownum"), 'EXT1');
});
return '<span></span>';
}
}
},
{
label: '签名上传', name: 'EXT1', width: 100, align: 'left'
, formatter: function (cellvalue, row, dfop, $dcell) {
var _data = dfop.rowdatas; //获取所有数据
$dcell.on('click',
function () { //对应参数表格id,当前行的索引,附件列数据,当前行号,列名,文件路径(文件夹(单据类型)),单元格对象
cellClick('#' + "gridtable", _data.indexOf(row), row.EXT1, $dcell.attr("rownum"), 'EXT1', "/UploadFiles/", $dcell);
});
return '<span class="btn btn-success lrUploader-input-btn" style="cursor:pointer;height: 90%;line-height: 90%;font-size: 12px;position: relative;bottom: 1px;">Upload</span>';
}
}

流程列表双击事件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
$.get(top.$.rootUrl + '/LR_NewWorkFlow/NWFProcess/GetNewProcessById',		
{ processId: row.Id },
function (res) {
res = eval('(' + res + ')');
if (res.code == 400) {
//Tips:查询是否是草稿 2021-10-08 wkz
$.post("/LR_NewWorkFlow/NWFProcess/GetDraftProcessById", { processId: row.Id }, function (resData) {
resData = JSON.parse(resData);
if (resData.code == 200) {
var data = resData.data;
// 关闭草稿页
learun.frameTab.closeByParam('tabProcessId', data.F_Id);
learun.frameTab.open({ F_ModuleId: data.F_Id, F_Icon: 'fa magic', F_FullName: '创建流程-' + data.F_SchemeName, F_UrlAddress: '/LR_NewWorkFlow/NWFProcess/NWFContainerForm?processId=' + data.F_Id + '&tabIframeId=' + data.F_Id + '&type=draftCreate' + "&IsProduce=" + row.IsProduce + "&keyValue=" + row.DesignateId + "&Isdraft=" + row.StatementNo });
}
})
return false;
}
var processId = res.data.F_Id || '';
var taskId = res.data.F_TaskId || '';
var title = res.data.F_Title;
var schemeName = res.data.F_SchemeName;
var taskType = res.data.F_TaskType;
var taskName = res.data.F_TaskName;
var F_IsAgain = res.data.F_IsAgain;
if (schemeName != title && title) {
title = schemeName + "(" + title + ")";
}
else {
title = schemeName;
}
var enabledMark = res.data.F_EnabledMark;
if (enabledMark == 2) {// draft不允许查看进度
learun.alert.warning("Draft cannot check the progress");
return;
}
if (res.data.F_IsFinished != 1) {
$.get(top.$.rootUrl + '/Fly_YD/Fly_YD_Waybill/Whether', {
taskId: taskId, processId, processId
}, function (res) {
if (JSON.parse(res).data) {
//重新发起
if (taskType == '5') {
learun.frameTab.open({ F_ModuleId: taskId, F_Icon: 'fa magic', F_FullName: '重新发起-' + title + '/' + taskName, F_UrlAddress: '/LR_NewWorkFlow/NWFProcess/NWFContainerForm?tabIframeId=' + taskId + '&type=againCreate' + "&processId=" + processId + "&taskId=" + taskId + '&checkIds=' + row.ReconciliaId + "&IsProduce=" + row.IsProduce + "&keyValue=" + row.DesignateId + "&Isdraft=" + row.StatementNo });
}
else {
learun.frameTab.open({ F_ModuleId: taskId, F_Icon: 'fa magic', F_FullName: '审批-' + title + '/' + taskName, F_UrlAddress: '/LR_NewWorkFlow/NWFProcess/NWFContainerForm?tabIframeId=' + taskId + '&type=audit' + "&processId=" + processId + "&taskId=" + taskId + '&checkIds=' + row.ReconciliaId + "&IsProduce=" + row.IsProduce + "&keyValue=" + row.DesignateId + "&Isdraft=" + row.StatementNo });
}
}
else {
if (taskType == '4' || taskType == '6') {
learun.frameTab.open({ F_ModuleId: processId + taskId, F_Icon: 'fa magic', F_FullName: 'Check the progress of the process【' + title + '】', F_UrlAddress: '/LR_NewWorkFlow/NWFProcess/NWFContainerForm?tabIframeId=' + processId + taskId + '&type=childlook' + "&processId=" + processId + "&taskId=" + taskId + '&checkIds=' + row.ReconciliaId + "&IsProduce=" + row.IsProduce + "&keyValue=" + row.DesignateId + "&Isdraft=" + row.StatementNo });
}
else {
learun.frameTab.open({ F_ModuleId: processId + taskId, F_Icon: 'fa magic', F_FullName: 'Check the progress of the process【' + title + '】', F_UrlAddress: '/LR_NewWorkFlow/NWFProcess/NWFContainerForm?tabIframeId=' + processId + taskId + '&type=look' + "&processId=" + processId + "&taskId=" + taskId + '&checkIds=' + row.ReconciliaId + "&IsProduce=" + row.IsProduce + "&keyValue=" + row.DesignateId + "&Isdraft=" + row.StatementNo });
}
}
})
} else {
if (taskType == '4' || taskType == '6') {
learun.frameTab.open({ F_ModuleId: processId + taskId, F_Icon: 'fa magic', F_FullName: 'Check the progress of the process【' + title + '】', F_UrlAddress: '/LR_NewWorkFlow/NWFProcess/NWFContainerForm?tabIframeId=' + processId + taskId + '&type=childlook' + "&processId=" + processId + "&taskId=" + taskId + '&checkIds=' + row.ReconciliaId + "&IsProduce=" + row.IsProduce + "&keyValue=" + row.DesignateId + "&Isdraft=" + row.StatementNo });
}
else {
learun.frameTab.open({ F_ModuleId: processId + taskId, F_Icon: 'fa magic', F_FullName: 'Check the progress of the process【' + title + '】', F_UrlAddress: '/LR_NewWorkFlow/NWFProcess/NWFContainerForm?tabIframeId=' + processId + taskId + '&type=look' + "&processId=" + processId + "&taskId=" + taskId + '&checkIds=' + row.ReconciliaId + "&IsProduce=" + row.IsProduce + "&keyValue=" + row.DesignateId + "&Isdraft=" + row.StatementNo });
}
}
});