在很多系統里,上傳附件是非常重要的一個功能,些功能是接口方式開發的,系統集成非常方便,只需要簡單實現接口,相關配制,頁面引入相關腳本。
- 接口定義
- 自行實現實現接口
- 配制文件
- 頁面插入代碼
引入相關腳本,和樣式
<script src= " Plugins/jquery-1.4.2.min.js " type= " text/javascript "></script>
<script src= " Plugins/MultiFilesUpload/jquery.uploadify.v2.1.4.min.js " type= " text/javascript "></script>
<link href= " Plugins/MultiFilesUpload/uploadify.css " rel= " stylesheet " type= " text/css " />
<script src= " Plugins/MultiFilesUpload/swfobject.js " type= " text/javascript "></script>
<link href= " Plugins/MultiFilesUpload/multifilesupload.css " rel= " stylesheet " type= " text/css " />
<script src= " Plugins/MultiFilesUpload/multifilesupload.js " type= " text/javascript "></script>
腳本:
$(document).ready(function() {頁面代碼:
MulFileUploadifyInit(
{
'ModuleName': "News",
'TableIdentityId': "abcidoaere123adf",
'ULID': "ShowListPic",
'UpdateLoadFloader': "/upload/projectfiles/",
'UploadFileControlId': "File1",
'UploadFileQuensId': "Div1"
});
MulFileUploadifyInit(
{
'ModuleName': "project",
'TableIdentityId': "123",
'ULID': "ShowListPic",
'UpdateLoadFloader': "/upload/projectfiles/",
'UploadFileControlId': "File2",
'UploadFileQuensId': "Div2"
});
});<div>
<input id="File1" type="file" />
<div id="Div1"></div>
</div>
<div>
<input id="File2" type="file" />
<div id="Div2">
</div>
</div> - 效果
上傳中。。。
點擊刪除
public
interface IMultiFilesInterface
{
MultiFileEntity Insert(HttpPostedFile file, string folder, string modulName, string tableIndentityId);
void DeleteByFileId( int FileId);
List<MultiFileEntity> GetListBy( string module, string tableIdentityId);
}
{
MultiFileEntity Insert(HttpPostedFile file, string folder, string modulName, string tableIndentityId);
void DeleteByFileId( int FileId);
List<MultiFileEntity> GetListBy( string module, string tableIdentityId);
}
<configSections>
<section name= " castle " type= " Castle.Windsor.Configuration.AppDomain.CastleSectionHandler, Castle.Windsor "/>
</configSections>
<castle>
<components>
<component id= " IMultiFilesInterface " service= " MultiFilesUpload.Plugins.MultiFilesUpload.IMultiFilesInterface, MultiFilesUpload " type= " 你的實現類, 組件名 (dll名)"/>
</components>
</castle>
<section name= " castle " type= " Castle.Windsor.Configuration.AppDomain.CastleSectionHandler, Castle.Windsor "/>
</configSections>
<castle>
<components>
<component id= " IMultiFilesInterface " service= " MultiFilesUpload.Plugins.MultiFilesUpload.IMultiFilesInterface, MultiFilesUpload " type= " 你的實現類, 組件名 (dll名)"/>
</components>
</castle>
可以訪問頁面:http://www.hkideals.com/uploadtest.aspx 測試效果