AjaxFileUpload在ASP.NET VB.Net中不起作用

问题描述

AjaxFileUpload适用于可见的TabContainer控件TabPanel，但不适用于最初不可见然后设置为可见的TabPanel。

我相信，如果TabPanels的可见性属性是通过JavaScript而不是通过服务器设置的，但不知道如何实现，则可以解决该问题。请帮助我解决此问题。谢谢。


<%@ Page Language="VB" AutoEventWireup="false" CodeFile="AjaxFileUpload.aspx.vb" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<!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 id="Head1" runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">
    
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnablePageMethods="true"></asp:ToolkitScriptManager>

    <p>AjaxFileUpload works on visible TabContainer control TabPanels yet not on ones that are initially invisible and then set to visible.</p>
    <p>I believe the issue would be resolved if the visibility property of the TabPanels is set by JavaScript rather than from the server.</p>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

    <ContentTemplate>

        <asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0">

            <asp:TabPanel ID="TabPanel1" runat="server" HeaderText="TabPanel 1">

            <ContentTemplate>

            <asp:Button ID="btnShow" runat="server" Text="Show"></asp:Button>

            </ContentTemplate>

            </asp:TabPanel>

            <asp:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel 2" Visible="false">

            <ContentTemplate>
            
            <asp:Button ID="btnHide" runat="server" Text="Hide"></asp:Button>

<asp:AjaxFileUpload ID="AjaxFileUpload1" runat="server" AllowedFileTypes="txt,xls,xlsx,doc,docx,msg,pdf,bmp,gif,jpg,jpeg,png" MaximumNumberOfFiles="5" Width="500px" OnUploadComplete="AjaxFileUpload1_OnUploadComplete"></asp:AjaxFileUpload>
  
            </ContentTemplate>

            </asp:TabPanel>

        </asp:TabContainer>    

    </ContentTemplate>

    </asp:UpdatePanel>
    
    </form>

</body>

</html>

后端VB.Net代码：


Imports System.IO
Imports AjaxControlToolkit

Partial Class _Default

    Inherits System.Web.UI.Page

    Protected Sub btnShow_Click(sender As Object,e As System.EventArgs) Handles btnShow.Click

        If TabPanel2.Visible = False Then TabPanel2.Visible = True
        TabContainer1.ActiveTabIndex = 1
        AjaxFileUpload1.Visible = True

    End Sub

    Protected Sub btnHide_Click(sender As Object,e As System.EventArgs) Handles btnHide.Click

        If TabPanel2.Visible = True Then TabPanel2.Visible = False

    End Sub

    Protected Sub AjaxFileUpload1_OnUploadComplete(ByVal sender As Object,ByVal e As AjaxFileUploadEventArgs)

        Dim strPath As String = Server.MapPath("~/Uploads")
        If Not Directory.Exists(strPath) Then Directory.CreateDirectory(strPath)

        Dim sFilename As String = System.IO.Path.GetFileName(e.FileName)
        Dim suploadpath As String = "~/Uploads/"
        AjaxFileUpload1.SaveAs(Server.MapPath(suploadpath) + sFilename)

        Dim filePath As String = Server.MapPath("~/Uploads/" & e.FileName)
        Dim filename As String = Path.GetFileName(filePath)

    End Sub

End Class

解决方法

实际上，即使将文本框设置为visible = false，该控件也不会向下发送到网页。因此，客户端甚至无法打开该简单文本框即可看到。

使用样式，不显示任何样式。

第一次初始化页面，其中包括js编写ajax上载程序。

因此，将混乱放入div（使用控件以及您需要隐藏/显示的其他任何内容），这样说：

 <div id="uploader" runat="server" style="display:none;width:50%">

     <ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload1" runat="server" 
          ChunkSize="8192" 
          ClientIDMode="Static"
          ViewStateMode="Enabled" />
 </div>

因此，如果您使用的是服务器端代码（某些按钮回发），则可以显示“ div”，如下所示：

Protected Sub Button1_Click(sender As Object,e As EventArgs) Handles Button1.Click

    Me.uploader.Style("display") = "inline"

End Sub

并隐藏：

    Me.uploader.Style("display") = "none"

请记住，当我们发回邮件时，所有“爵士” JavaScript仍然需要在第一个页面加载时进行跳舞。（因此，我们不能在首页加载时（针对控件或div）使用visible = false）。您需要加载整个页面-包括仅在ajaxupload控件第一次加载时运行的代码加载。如果不是第一页加载-控件将无法正确设置和初始化。

因此，通过使用样式，控件将在首次加载页面时呈现。这个概念不仅适用于Ajax，还适用于隐藏的文本框，或者什么呢？再次，使用不显示任何样式。

实际上，在用户选择文件并使用该控件上载过程中吗？好吧，你不想回帖。但是，当整个加载完成时？和服务器端事件（例如保存文件）一样，那么我经常想要一些最终代码，甚至是继续进行浏览的网页。我确实希望最后的回发继续进行。但是，我需要回发客户端！

代替使用JaveScript _dopostback？（这会迫使您在服务器端页面加载事件中编写参数代码？我只是在窗体上的某个位置放了一个ASP按钮，然后隐藏了它（当然使用style =“ display：none”）。

现在，我可以使用客户端js来“单击”该隐藏的按钮。这样的好处在于，用于单个按钮代码运行的服务器端事件代码存根，而我没有在加载事件中使用_doPostBack +代码编写事件代码来让代码存根服务器端运行！

现在，在上面，我在服务器端的代码后面显示了上载程序。

但是，您也可以很容易地使用客户端代码来隐藏或显示该div。

如果您使用jQuery（）？

好吧，jQuery具有.hide（）和.show（）（猜猜是什么！-.hide（）/。show（）实际上为您设置了样式！！！-甚至jQuery都假定您隐藏或显示具有样式的控件，因为使用“ SomeControl.visible”几乎是无用的（因为任何设置为visible = false的内容都不会在客户端呈现-因此，无论如何您都无法隐藏/显示！！）。>

因此，要使用jQuery隐藏/显示它，可以使用以下客户端：

         function show() {
             $('#uploader').show();
         }

         function hide() {
             $('#uploader').hide();

         }

并且，如果您不使用jQuery，并且想要隐藏/显示div，那么？（javascript）。

这将起作用：

         function showl2() {
             var mydiv2 = document.getElementById('<%=uploader.ClientID%>');
             mydiv2.style.display = "inline";
         }

         function hidel2() {
             var mydiv = document.getElementById('<%=uploader.ClientID%>');
             mydiv.style.display = "none";
         }

因此，这里的简单概念是控件必须在页面加载时呈现，并且必须在第一次执行。因此，它必须落到浏览器端。任何不可见的控件都不会向下发送到客户端。但是，使用css意味着控件在所有情况下都是从客户端发送的。

现在，上传之后，我想在页面的背面发表完整的文章吗？好吧，请注意，这可能很困难，因为在运行ajax服务器端事件（例如保存文件）之后，当一切都说完之后，您不会得到最终的回复。

因此，我为ajax上载程序设置了一个客户端事件，如下所示：

 <ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload1" runat="server" 
      AllowedFileTypes="pdf,zip"
      ChunkSize="8192" 
      OnClientUploadCompleteAll="UpLoadDone"
  />

因此，请注意上述客户端事件-所有代码（服务器和客户端均已完成）。但是我们现在希望从客户端进行回发。

那么，在UpLoadDone例程中？

我有这个：

  function uploaddone() {
    document.getElementById('<%= btnProof.ClientID %>').click();
    }

因此，我得到了回复，并且按钮存根服务器端的代码也运行了。那个btProof隐藏了样式。但是，这是一个常规的asp.net按钮。我只是希望在ajax文件上传完成后单击它。但是，实际上并没有一种方法可以使ajax上载并触发所有内容。但是，再次：使用带有样式的隐藏控件的概念-因为如果我使用.visible = false来隐藏该按钮，则实际上该按钮将不存在于客户端，并且永远不会呈现或放置到浏览器客户端。

asp.net vb.net vb.net webforms