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

【问题标题】：AjaxFileUpload does not work in ASP.NET VB.NetAjaxFileUpload 在 ASP.NET VB.Net 中不起作用
【发布时间】：2020-08-10 16:40:34
【问题描述】：

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

我相信如果 TabPanels 的可见性属性是由 JavaScript 而不是从服务器设置的，但不知道如何设置，问题将会得到解决。请帮我解决这个问题。谢谢。

ASPX 代码：


<%@ 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

【问题讨论】：

这个问题与c# 或vbscript 两个标签都被删除无关。

标签： asp.net vb.net webforms

【解决方案1】：

实际上，即使您将文本框设置为 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>

所以，如果你在 SERVER 端代码（一些按钮回发），那么你可以像这样显示“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 仍然需要在第一个页面加载时跳舞。（因此，我们不能在第一页加载时使用 visible = false）（以及针对控件或 div）。您需要加载整个页面 - 包括仅在 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 隐藏该按钮，那么实际上该按钮将不存在客户端，并且永远不会呈现或放置到浏览器客户端。

【讨论】：

感谢您的回复。请编写完整的代码以在我这边检查。提前致谢。
@AliG 请编写您自己的代码，我们是来帮助您完成这项工作的。