我经常看到这个问题被问到,并且我已经做了广泛的实验来尝试让它发挥作用。然而,到目前为止,其他所有人的例子和答案都让我失望了。我很困惑。情况如下:
- AsyncFileUpload 不在 UpdatePanel 中
- 要更新的图像和标签在 UpdatePanel 中
- 上传完成后应进行更新
上传确实按预期保存文件。我的问题是在发生这种情况后让页面更新。上传的文件是一张图片,我希望更新该图片。我知道如果您重用文件名,图像在客户端上不会更新的一些问题,但我也将它打印到标签上以确保。我确定我所针对的 UpdatePanel 没有更新。
我尝试了以下方法:
- 使用服务器端方法手动更新有条件的 UpdatePanel - 这会失败,因为文件上传是在框架中完成的。嗅探返回的 HTML 表明正确的 HTML 实际上是在发布后发回的,但当然是发送到错误的帧。
- 使用客户端方法触发 javascript 回发到我的 UpdatePanel。这不起作用,我不知道为什么。
- 使用客户端方法触发更新面板内的 javascript 按钮单击。同样,什么也没发生,我不知道为什么。
- 设置 UpdatePanel 的触发器,使其直接指向 AsyncFileUpload。没有喜悦,但我知道那将是一个很长的镜头,记住隐藏的框架。
- 将 AsyncFileUpload 移动到 UpdatePanel 并尝试上述各种方法。当我这样做时,我失去了发布到服务器的文件的所有句柄,并且我一开始就无法保存文件。
通常,当我遇到这种错误时,所有教程似乎都是错误的,事实证明我的错误是因为我没有在某处的控件上设置 ID 并且它在某种程度上很重要。在这种情况下,我什至看不到这一点。这是一些代码。
<fieldset class="pj_Pics">
<ul>
<li>
<label>Picture 1</label>
<asp:UpdatePanel ID="ajax_Pic1" runat="server" UpdateMode="Always">
<ContentTemplate>
<asp:Image ID="img_Pic1" runat="server" />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<asp:Button ID="Button1" runat="server" Text="Button" />
</ContentTemplate>
</asp:UpdatePanel>
<div style="position:relative;">
<div class="photoChooser">
<ajaxToolkit:AsyncFileUpload ID="fu_Pic1" runat="server" CssClass="pj_PicChoose" Width="84px" OnClientUploadComplete="picPost1" OnUploadedComplete="fu_PictureFile_UploadedComplete" ThrobberID="throb1" />
<span><asp:Literal runat="server" Text="click to change"></asp:Literal></span>
<asp:Image ID="throb1" runat="server" ImageUrl="~/images/throbber.gif" AlternateText="uploading image" />
</div>
</div>
</li>
</ul>
</fieldset>
protected void fu_PictureFile_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
bla bla bla;
// and update the image
img.ImageUrl = "~/" + webfolder + imageFileName;
thing.Text = img.ImageUrl;
}
function picPost1(sender, args) {
document.getElementById('<%# Button1.ClientID %>').click();
}
非常感谢任何帮助。页面上显然有一个 ScriptManager,我展示的代码只是我尝试的最后一件事。让我知道您是否还有其他需要查看的内容。
谢谢!