Ajax 异步文件上传不会触发服务器端事件

问题描述 投票:0回答:1
<asp:UpdatePanel runat="server" ID="SaveLocalConnectionupdate" UpdateMode="Conditional">
        <ContentTemplate>                       
             <ajaxToolkit:AsyncFileUpload runat="server" ID="AsyncFileUpload1" OnUploadedComplete="AsyncFileUpload1_Complete"/>
             <asp:LinkButton CssClass="btn btn-sm btn-success" Text="Save Connection" runat="server" Style="cursor: pointer;" ID="Savelocalconnection" OnClick="UploadBtn_Click" OnClientClick="return SavelocalS3ConDetails()" ></asp:LinkButton>
        </ContentTemplate>                       
</asp:UpdatePanel>

 protected void AsyncFileUpload1_Complete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
    if (AsyncFileUpload1.HasFile)
    {
        string path = Config.root_path + "s3_localfile\\" + AsyncFileUpload1.FileName;
        AsyncFileUpload1.SaveAs(path);
        string fileType = Path.GetExtension(path);
        Localfilelabel.Text = "File Uploaded: " + AsyncFileUpload1.FileName;
        LocalfilelabelUpdate.Update();

    }
    else
    {
        Localfilelabel.Text = "No File Uploaded.";
        LocalfilelabelUpdate.Update();
    }
}

这里服务器端功能不会触发。 我想实现文件上传而不需要完整的回发,这是我的标记和服务器端功能。

javascript c# asp.net file-upload webforms
1个回答
0
投票

好吧,让我们尝试一下:

首先有几件事:

既然异步上传不会回发,那么你就不需要更新面板了,是吗?

请记住,更新面板不会阻止回发,但允许您执行所谓的部分页面回发。因此,虽然更新面板看起来没有进行回发,但实际上它确实进行了回发,而且事实上您发现即使是页面加载事件也会触发,并且每次使用更新面板时都会触发。换句话说,更新面板不会阻止回发。

但是,AsyncFileUpload 不会回发,但是您有以下代码:

Localfilelabel.Text = "No File Uploaded.";

上面的情况怎么可能呢?网页和标记仍然在用户桌面上并且尚未发布。这意味着对于任何不回发的代码,此类代码永远不能修改网页上的控件,因为您从未发生或允许回发发生。如果不发生回发,则您不能修改控件,因为网页和控件仍然位于用户的桌面上,并且尚未发送到服务器。并且由于标记和内容尚未发送到服务器,因此这样的代码不能修改网页上的控件,因为网页尚未发送到服务器。 (更糟糕的是,网页不会发送回客户端,因此无法使用更改文本框或标签的代码)。您必须使用客户端代码来更新该标签。

我们不理会您的链接按钮代码,但非常但非常不清楚为什么事件存根名称与链接按钮不匹配,当然您不显示客户端代码。 (但是,我们在这里一次只讨论一个问题)。

因此,上传控件工作的标记将是这样的:

<ajaxToolkit:AsyncFileUpload runat="server" 
    ID="AsyncFileUpload1" 
    OnUploadedComplete="AsyncFileUpload1_UploadedComplete"
/>

由于上述控件不会也不会回发,因此几乎不需要将此代码放置在更新面板中。

所以有了上面的内容,那么后面的代码就可以是:

   protected void Page_Load(object sender, EventArgs e)
   {
       if (!IsPostBack)
       {
       }

   }


   protected void AsyncFileUpload1_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
   {
       if (AsyncFileUpload1.HasFile)
       {
           // string path = Config.root_path + "s3_localfile\\" + AsyncFileUpload1.FileName;
           string sFile = Server.MapPath(@"~/UpLoadedFiles/" + e.FileName);
           AsyncFileUpload1.SaveAs(sFile);

       }
   }

现在上面的代码应该可以正常工作了。

因此,我们可以将上述控件放在更新面板中,但这不会有太大帮助,因为异步上传控件不会回发,这意味着我们无法修改网页上的控件该代码存根,因为如上所述,这里的整个想法是不要回发。如果没有回发,您就无法修改该代码存根中网页上的控件。您也无法在该代码存根中获取/获取/查看/了解/享受网页上的任何控件的使用,因为再次强调,整个想法是不要将页面回发到服务器。如前所述,如果没有回发,那么您就无法更改、查看、修改、触摸或查看该网页上任何控件的值,因为它仍然位于用户桌面上,并且没有发生回发,对吗?

请记住,到目前为止我们拥有的完整页面标记是这样的:

那么,我们稍微修改一下代码,看看它是否可以运行:

我们有:

    protected void AsyncFileUpload1_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
    {
        if (AsyncFileUpload1.HasFile)
        {
            // string path = Config.root_path + "s3_localfile\\" + AsyncFileUpload1.FileName;
            string sFile = Server.MapPath(@"~/UpLoadedFiles/" + e.FileName);
            AsyncFileUpload1.SaveAs(sFile);

            Debug.Print("file upload code done - file save = " + sFile);
        }
    }

那么,现在让我们运行这段代码。正如我所说,此示例中的更新面板(到目前为止)并不重要,没有被使用,没有发挥作用,并且此时没有实际的额外标记。

所以,到目前为止我们已经有了这个标记:

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

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

            <ajaxToolkit:AsyncFileUpload runat="server" 
                ID="AsyncFileUpload1" 
                OnUploadedComplete="AsyncFileUpload1_UploadedComplete"
            />

            <asp:LinkButton CssClass="btn btn-sm btn-success" 
                Text="Save Connection" runat="server" 
                Style="cursor: pointer;" ID="Savelocalconnection" 
                OnClick="UploadBtn_Click" OnClientClick="return SavelocalS3ConDetails()" >
            </asp:LinkButton>


            </ContentTemplate>                       
        </asp:UpdatePanel>


</form>

我们运行的结果是这样的:

因此,没有浏览器“等待”或微调器。并且没有页面回发。

所以,上面的代码对我来说效果很好。

创建一个测试页面。添加异步文件上传控件,然后让它工作。

如上所述,上面(到目前为止)不需要更新面板,因为异步上传控件的整个想法是不回发页面,因此没有回发,但请记住,这意味着该异步上传的代码存根无法修改或触摸或查看网页上的控件,因为网页仍然位于用户的桌面上而没有回发。

因此,除了脚本管理器(必需)之外,无需任何其他东西即可启动页面,然后是一个上传控件。

此外,使用非常小的文件进行测试,然后尝试使用更大的文件。另外,如上所示,我确实使用了 debug.print 来帮助调试,这显示了服务器端事件代码存根过去和现在正在运行。

© www.soinside.com 2019 - 2024. All rights reserved.