使用UpdateProgress的FileUpload

时间:2009-08-24 08:41:09

标签: c# asp.net jquery ajax

更新
我添加了一个java脚本函数:

function showWait()
            {
                if ($get('filUpload').value.length > 0)
                {
                    $get('UpdateProgress1').style.display = 'block';
                }
            }


 <asp:Button ID="btnUpload" runat="server" OnClick="btnUpload_Click" OnClientClick="javascript:showWait();" Text="OK" CausesValidation="false" />

但是我需要在ajax ModalPopupExtender面板中工作,所以当我运行代码时,UpdateProgress出现但动画gif没有动画!它是静止的!

<head runat="server">
 <script type="text/javascript">
            function showWait()
            {                       
                $get('UpdateProgress1').style.display = 'block';               
            }



        </script>
    <title>Untitled Page</title>
    <link href="Controls/UploadFile.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>


    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>    

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
    <asp:Button id="btnShowPopup" runat="server" Text="Open" />
      <asp:Panel ID="pnlUploader" runat="server" CssClass="pnlUploader" Width="280px" style="display:none;" >      


        <div id ="pnlDragMe" class="pnlDragMe">Image Uploader </div>   
        <div id="uploaderContent" class="uploaderContent" runat="server">      
            Select File:
          <br />
          <asp:FileUpload ID="filUpload" runat="server" />
          &nbsp;<br />
          <div id="buttons" >
             <asp:Button ID="btnUpload" runat="server" OnClick="btnUpload_Click" OnClientClick="javascript:showWait();"  Text="OK" CausesValidation="false" />
             <asp:Button ID="btnCancel" runat="server" Text="Cancel" />
          </div> 
        </div>  
        <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
           <ProgressTemplate>
               <img alt="" src="Images/ajax-loader.gif" style="width: 48px; height: 48px" />
               Uploading image...
           </ProgressTemplate>
        </asp:UpdateProgress>      
            <asp:Label ID="lblFeedbackOK" SkinID="FeedbackOK" runat="server"></asp:Label>
            <asp:Label ID="lblFeedbackKO" SkinID="FeedbackKO" runat="server"></asp:Label>              


        <cc1:ModalPopupExtender ID="mdlPopup1" runat="server" 
           TargetControlID="btnShowPopup" PopupControlID="pnlUploader" 
           CancelControlID="btnCancel" BackgroundCssClass="modalBackground" 
           PopupDragHandleControlID="pnlDragMe" Drag="true" RepositionMode="None" />
      </asp:Panel>


    </ContentTemplate>
    <Triggers>
        <asp:PostBackTrigger ControlID="btnUpload" />
    </Triggers>    

</asp:UpdatePanel>

    </form>
</body>

我想动画gif是静态的,因为PostBackTrigger。

1 个答案:

答案 0 :(得分:2)

FileUpload控件在UpdatePanel内部不起作用。

请参阅http://msdn.microsoft.com/en-us/library/cc295545.aspx