如何使用更新进度在使用文件上载控件上载文件时显示进度条 [英] How to show a progress bar while uploading file with file upload control using update progress
本文介绍了如何使用更新进度在使用文件上载控件上载文件时显示进度条的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
如何在使用fileupload控件上传文件时显示进度条的进度？
i写的代码就像这个文件正在上传但是进度条没有显示进度..
aspx文件中的代码：
How can i show the progress with the progress bar while uploading the file with fileupload control?
i wrote the code like this file is uploading but progress bar is not showing the progress..
Code in the aspx file:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="updprogress.aspx.cs" Inherits="updprogress" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="scripts/JScript.js" type="text/javascript"></script>
<style type="text/css">
.style1
{
width: 254px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<%-- <Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click"/>
</Triggers>--%>
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Upload" OnClick="Button1_Click" />
<asp:FileUpload ID="FileUpload1" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" >
<ProgressTemplate>
<img src="images/progressbar.jpg" height="40px" width="50" />
</ProgressTemplate>
</asp:UpdateProgress>
</div>
</form>
</body>
</html>
cs文件中的代码：
Code in cs file:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class updprogress : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void UpdateButton_Click(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
FileUpload1.SaveAs(Server.MapPath("~/" + FileUpload1.FileName));
Button1.Text = "uploaded successfully";
}
}
Code in the script file:
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
var postBackElement;
function InitializeRequest(sender, args) {
if (prm.get_isInAsyncPostBack())
args.set_cancel(true);
postBackElement = args.get_postBackElement();
if (postBackElement.id == 'Button1')
$get('UpdateProgress1').style.display = 'red';
}
function EndRequest(sender, args) {
if (postBackElement.id == 'Button1')
$get('UpdateProgress1').style.display = 'none';
}
推荐答案
get（' UpdateProgress1'）。style.display = ' red';
}
函数EndRequest（sender，args）{
if （postBackElement.id == ' Button1'）
get('UpdateProgress1').style.display = 'red'; } function EndRequest(sender, args) { if (postBackElement.id == 'Button1')
get（' UpdateProgress1'）。style.display = ' none ;
}
get('UpdateProgress1').style.display = 'none'; }
尝试将以下两个属性提供给更新面板。
Try giving below two attributes to your update panel.
ChildrenAsTriggers="true" UpdateMode="Conditional"
这篇关于如何使用更新进度在使用文件上载控件上载文件时显示进度条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
