AjaxUploader使用

来源：互联网发布：网络推广工资考核标准编辑：程序博客网时间：2024/05/18 03:59

一、简介：

1.下载地址：http://ajaxuploader.com/download/Ajax-Uploader.zip

2.官方网站：http://ajaxuploader.com/

3.费用列表：http://ajaxuploader.com/Order.aspx

二、初步使用：

1.将CuteWebUI.AjaxUploader.dll和AjaxUploader.lic添加到Bin文件夹中。

2.在Web.config的httpModules列表中添加AjaxUploader httpModule。

</httpModules>

3.设置文件临时文件

<CuteWebUI:Uploader id="uploaderFile" TempDirectory="~/UploaderTemp" runat="server"></CuteWebUI:Uploader>

或<add key="CuteWebUI.AjaxUploader.TempDirectory" value="~/UploaderTemp"/>

4.设置上传文件大小

<CuteWebUI:Uploader runat="server" ID="uploaderFile">

</CuteWebUI:Uploader>

或<add key="CuteWebUI.AjaxUploader.GlobalMaxSizeKB" values="1000"/>

5.限制上传速度　　

　　Please note that this setting will not work for small files orsilverlight upload mode.

三、自定义UI

1.自定义上传按钮

<CuteWebUI:Uploader ID="uploaderImg" ruant="server" InsertButtonID="btnUpload"></CuteWebUI:Uploader> <asp:Button ID="btnUpload" runat="server" Text="上传图片"/>

2.自定义取消按钮

<CuteWebUI:Uploader ID="uploaderImg" runat="server" CancelButtonID="btnCancel"></CuteWebUI:Uploader> <asp:Button ID="btnCancel"runat="server" Text="取消上传"/>

3.自定义进度栏面板

<CuteWebUI:Uploader ID="uploaderImg" runat="server" ProgressCtrlID="panel" ProgressTextID="label"></CueWebUI:Uploader><asp:Panel ID="panel" runat="server">     <asp:Label ID="label" runat="server"></asp:Label></asp:Panel>

4.自定义进度模板

在上面基础上添加ProgressTextTemplate属性示例：ProgressTextTemplate="正在上传%F%,进度%SEND%/%SIZE%,速度%KBPS%,剩余%T%秒"

%P%：进度百分比

%T%：估计剩余时间(秒)

%F%：当前文件名

%SEND%：已经上传文件大小

%SIZE%：文件大小

%KBPS%：当前上传速度（KB/sec）

%BPS%：当前上传速度（B/sec）

：换行

5.创建自定义队列的表

方法1：

<CuteWebUI:UploadAttachments runat="server" ID="UploadAttachments1"></CuteWebUI:UploadAttachments>

<div id="queuediv" style="display:none">    <div id="queuedivtablecontainer"></div>    <div style="font-size:larger;padding-let:100px;margin:4px;">        <a href="#" onclick="cancelalltasks();returnfalse;">Cancel All Tasks.</a> </div> </div> <script>    Var uploader = document.getElementById("<%=UploaderAttachments1.ClientID %>");    uploader.handlequeueui = myqueueuihandler;    function myqueueuihandler(list)     {        if(list.length < 2)    document.getElementById("queuediv").style.display="none";        else{    document.getElementById("queuediv").style.display="";    var container =document.getElementById("queuedivtablecontainer");    var table = document.createElement("table");    table.style.borderCollapse="collapse";    table.cellSpacing=0;     table.cellPadding= 4;    table.border=1;    table.borderColor = "darkgreen";    for(var i =0;i<list.length;i++){        var name = list[i].FileName;        var size = list[i].FileSize;        var stat = list[i].Status;        var func = list[i].Cancel;        var row = table.insertRow(-1);        if(stat=="Queue"){    var btn = document.createElement(" A");    btn.href="javascript:void(0)";    btn.onclick=func;    btn.innerHTML ="Cancel";    last.appendChild(btn); }else{    Last.innertHTML = stat; } } Container.appendChild(table); } Return false; } function cancelalltasks(){    Uploader.cancelall(); } </script>

方法二：

Protected void Attachments1_PreRender() {    Attachments1.GetItemsTable().Visible = false;    DataList1.DataSource = Attachments1.Items;    DataList1.DataBind(); }

 <CuteWebUI:UploadAttachments ID="Attachments1" runat="server" OnPreRender="Attachments1_PreRender"></CuteWebUI:UploaderAttachments> <asp:DataList ID="datalist" runat="server">    <ItemTemplate>    <table border="1">    <tr>    <td><%# Eval("FileName")%></td><td><%# Eval("FileSize")%></td><td><%# Eval("FileGuid") %></td> </tr> </table> </ItemTemplate> </asp:DataList>

最后献上破解版下载地址

0 0