上傳附件可能是CRM里比較常用的一個需求了,本文將介紹如何在CRM里實現附件的上傳、顯示及下載。包括以下幾個步驟:
- 附件上傳的web頁面
- 附件顯示及下載的附件實體
- 調用上傳web頁面的JS文件
- 實體上r的上傳按鈕
- 首先來看一下效果:
先點擊上面的上傳按鈕,然后就會彈出一個上傳附件的界面,選擇需要上傳的文件,填寫文件名,點擊上傳,成功后會在下面的文件grid里顯示已上傳的文件,雙擊下面的文件就會打開文件的詳細信息:
然后還可以下載文件。
- 下面來看下實現方法
1. 附件上傳的web頁面
新建一個普通的web程序,加上一個aspx頁面用於實現文件上傳,這里用的是jquery里的uplodify:
這是實現上傳的js代碼
1: $( document ).ready( function ()
2: {
3: uploadFiles();
4: } );
5:
6: function uploadFiles()
7: {
8: $( "#uploadify" ).uploadify( {
9: 'swf': 'Scripts/upload/uploadify.swf',
10: 'uploader': 'uploader.ashx',
11: 'queueID': 'fileQueue',
12: 'auto': false,
13: 'multi': true,
14: 'onUploadError': function ( file, errorCode, errorMsg, errorString )
15: {
16: alert( 'The file ' + file.name + ' could not be uploaded: ' + errorString );
17: },
18: 'onUploadSuccess': function ( file, data, response )
19: {
20: $( '<li><a href="' + data + '">' + file.name + '</a></li>' ).appendTo( $( 'ul' ) );
21: }
22: } );
23: }
24:
25: function Upload()
26: {
27: $( '#uploadify' ).uploadify( 'upload', '*' );
28: }
這是頁面上顯示的內容:
1: <table class="GbText">
2: <tr>
3: <td>
4: <input type="file" name="uploadify" id="uploadify" />
5: </td>
6: <td>
7: <input type="button" value="Upload Files" class="uploadify-button" style="height:25px; width: 112px;" onclick="javascript: $( '#uploadify' ).uploadify( 'upload', '*' )" />
8: <input id="yes" class="Button" onclick="UpFiles();" onmouseout="this.className='Button'" onmouseover="this.className='Button-Hover'" style="width:50px" type="button" value="Confirm" />
9: </td>
10: </tr>
11: <tr>
12: <td colspan="2">
13: <ul id="ul"></ul>
14: </td>
15: </tr>
16: </table>
17: <div id="fileQueue">
最后把它放到ISV下面:
2. 附件實體
- 字段
紅框中的字段為lookup類型,需要實現上傳功能的實體的id,其余為基本字段
- 界面
中間紅框中是一個iframe, 其它沒什么介紹的:
- 調用上傳web頁面的JS文件
1: var uploadCfg = {
2: fileFloder: Xrm.Page.data.entity.getEntityName(),
3: entityReferenceName: Xrm.Page.data.entity.getEntityName() + "id",
4: entityName: Xrm.Page.data.entity.getEntityName().toLowerCase()
5: };
6:
7: function uploadFile() {
8: var openURL = "/ISV/FilesUpload/FileUpload.aspx?FileFolder=" + uploadCfg.fileFloder + "&EntityName=" + uploadCfg.entityName
9: + "&EntityReferenceName=" + uploadCfg.entityReferenceName + "&EntityId=" + Xrm.Page.data.entity.getId()
10: + "&UserId=" + Xrm.Page.context.getUserId();
11: window.showModalDialog(openURL, "_blank", "dialogWidth=500px;dialogHeight=300px;help:no;status:no"); //打開模態窗體
12: }
- 上傳按鈕
添加按鈕並指定function名uploadFile
/_imgs/ribbon/AddConnection_16.png
uploadFile
$webresource:new_upload_file.js