我有一个使用WebForms在ASP.NET中构建的页面。
我有几个UpdatePanel似乎工作正常。但是我遇到了一个问题。
我有一个组合框,当值被更改时,它会连接到TFS并检索项目的详细信息以填充列表框。这可能需要一些时间才能完成,因为我们的TFS服务器位于澳大利亚,而且我在英国,所以我想我会显示一个小图形来向用户表明它在详细信息中的加载。
所以这是我到目前为止的一个例子:
HTML:
<asp:ScriptManager ID="ScriptManager1" runat="server"/>
<asp:Panel ID="InnerPannelLeft" runat="server" CssClass="innerContentPanel_Left">
<asp:Panel ID="Panel2" runat="server" CssClass="innerContentPanel_Border">
<asp:Panel ID="Panel3" runat="server" CssClass="runResultsPanels">
<asp:Label ID="Label2" runat="server" Text="Test Suite: "></asp:Label>
<asp:DropDownList ID="TestSuite" runat="server" OnSelectedIndexChanged="TestSuite_SelectedIndexChanged" AutoPostBack="True">
<asp:ListItem Selected="True">Select a Test Suite</asp:ListItem>
<asp:ListItem>Trades</asp:ListItem>
<asp:ListItem>Dividends</asp:ListItem>
</asp:DropDownList>
</asp:Panel>
</asp:Panel>
</asp:Panel>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="TestSuite" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>
<asp:Panel ID="LoadingPanel" CssClass="innerContentPanel_Border" runat="server" Visible="false">
<asp:Panel ID="TimeDiv" runat="server">
<asp:Label ID="Label6" runat="server" Text="Loading..."></asp:Label>
<asp:Panel ID="TimerAnimation" CssClass="timer" runat="server"></asp:Panel>
</asp:Panel>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
C#:
protected void TestSuite_SelectedIndexChanged(object sender, EventArgs e)
{
if (TestSuite.SelectedIndex > 0)
{
//Show the loading div
LoadingPanel.Visible = true;
//Long running code that grabs stuff from TFS
//Grabbing stuff from TFS has finished so hide the div
//LoadingPanel.Visible = false;
}
}
所以有代码。但基本上发生的事情是,在组合框更改方法中的处理完成之前,它不会显示div。
在组合框开始做所有长时间运行的东西之前,有没有办法让div显示出来?
我认为将div放在更新面板中并添加触发器会允许它异步更新面板?如果我错了,请原谅我的无知,MSDN网站让我很困惑。
编辑:我添加了一些JQuery,它可以根据onchange事件显示警报。 但它不会做的就是使div可见。这里是代码:
$(document).ready(function ()
{
$("#<%=TestSuite.ClientID%>").change(function()
{
if ($(this).find('option:selected').text() === "Select a Test Suite")
{
alert("Hide the panel");
$("#<%=LoadingPanel.ClientID%>").hide();
}
else
{
alert("Show the panel");
$("#<%=LoadingPanel.ClientID%>").show();
}
})
})
我猜这是与回发有关并忘记了更改? DIV的默认可见性设置为false。
所以我想每次回发完成(这是每次我更改组合),然后它将回到默认状态。或者我在错误的地方?
答案 0 :(得分:1)
TestSuite_SelectedIndexChanged是服务器端事件,因此在回发之前它不会显示任何内容。您需要在启动之前使用javascript或jquery在客户端执行某些操作,或者您可以添加AjaxUpdate控件:http://www.asp.net/ajax/documentation/live/overview/updateprogressoverview.aspx