我想在updatepanel的工作完成時顯示進度動畫,但不需要重新渲染updatepanel的內容。UpdatePanel和UpdatePanelAnimationExtender問題
如果我設置ChildrenAsTriggers =「false」,則UpdatePanelAnimationExtender的onupdated腳本不會觸發(function onUpdated())。
如果我設置ChildrenAsTriggers =「true」,並點擊顯示div按鈕,更新完成後,updatepanel的內容被重新渲染(div再次被隱藏)。
我的代碼:
<head id="Head1" runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
function ShowHide(){
var div = document.getElementById('div2');
if (div.style.display=="none")
div.style.display="";
else
div.style.display="none";
}
function onUpdating(){
// get the update progress div
var pnlPopup = document.getElementById("div2");
}
function onUpdated() {
// get the update progress div
var pnlPopup = $get("div2");
// make it invisible
}
</script>
</head>
<body>
<form id="form11" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<input id="Button1" onclick="ShowHide();" type="button" value="Show Div (click first)" />
<asp:Button ID="Button2" runat="server" Text="Button" OnClick="Click" />
<div id="div1" style="background-color:Red;width:700px;height:200px;"> </div>
<div id="div2" style="background-color:Blue;width:700px;height:500px;display:none;"></div>
</ContentTemplate>
</asp:UpdatePanel>
<cc1:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" TargetControlID="UpdatePanel1" runat="server">
<Animations>
<OnUpdating>
<Parallel duration="0" >
<ScriptAction Script="onUpdating();" />
</Parallel>
</OnUpdating>
<OnUpdated>
<Parallel duration="0">
<ScriptAction Script="onUpdated();" />
</Parallel>
</OnUpdated>
</Animations>
</cc1:UpdatePanelAnimationExtender>
</form>
</body>
protected void Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
}
爲什麼它更好? – dani 2009-10-13 09:22:37
我需要激活onupdating腳本。它有一些計算和定位。 – dani 2009-10-13 09:24:14
並檢查後,它根本不起作用。面板重新渲染...... – dani 2009-10-13 10:03:53