附件集成演示
功能⽬标：为学⽣⻚⾯中的每⼀个学⽣信息添加附件管理功能，要求可以学⽣维护多个附件，并且可以下载和删除。
-
在系统前端新建⽬录 Home/ORA_2062/学⽣管理 ，其中附件⽬录 学⽣管理 的关键属性如下：
** 附件文件夹：**
image.png
** 附件目录：**
image.png
开始写代码了....
新建⻚⾯student_attachment.html 并利⽤ 附件上传 的功能进⾏附件功能初始化（不要格式化html代码)，
<#include "../include/header.html">
<body>
<div style="width:780px;margin:10px;">
${attachmentProvider.getAttachHtml("ORA_20796_STUDENT",RequestParameters.studentId,base.locale, base.contextPath,true,true)}
</div>
</body>
</html>
attachmentProvider 的关键属性如下:
| 参数 | 值 | 说明 |
|---|---|---|
| sourceType | ORA_20796_STUDENT | (之前在界面操作的时候命名的) |
| sourceKey | RequestParameters.studentId | ⻚⾯参数学⽣ID，这样才能知道这个附件属于哪个学生的 |
现在开始更改student.html
在 KendoGrid 新增列，⽤于打开每⼀名学⽣的附件界⾯：
//点击弹出附件上传窗口
{
title:'<@spring.message "attachcategory.attachmentmanagement"/>',
width : 40,
headerAttributes: {
style : "text-align: center"
},
attributes: {style: "text-align:center"},
template : function (rowdata) {
if (!!rowdata.studentId) {
return '<a href="#" onclick="openAttachmentWindow(' + rowdata.studentId + ')"><i class="fa fa-paperclip"></i></a>'
} else return ''
},
sortable: false
},
<!--附件上传管理DIV-->
<div id="attachment-window"></div>
//初始化附件选择window
$("#attachment-window").kendoWindow({
width: "800px",
height:"300px",
title: '<@spring.message "attachcategory.attachmentmanagement"/>',
modal:true,
resizable: false,
visible:false,
iframe:true
});
/**
* 打开附件窗口，尽量在最上面的<script></script>里面写
* @param studentId
*/
function openAttachmentWindow(studentId) {
var win = $("#attachment-window").data("kendoWindow");
win.refresh('student_attachment.html?studentId=' + studentId);
win.center().open();
}
注意div的id=attachment-window,还有点击事件openAttachmentWindow()是否对应
之前：
image.png
之后：
image.png
网友评论