ASP.NET AJAX UI

Re: Controlling visibility of contents of collapsiblepanel

Jin-Yu Yin - MSFT — Mon, 23 Jul 2007 05:42:57 GMT

As the contents of the panel which is collapsed are very large,you can delay by several seconds to load the content.

You don't need to load it when the whole page load.when the whole page is loading,set the panel unvisible.

Then load the content of the panel.

Code as follow:

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    protected void Button1_Click(object sender, EventArgs e)
    {
        System.Threading.Thread.Sleep(3000);
        TextBox1.Text = DateTime.Now.ToString();
    }
</script>

<script type="text/javascript">
function delayLoad()
{
document.getElementById("<%= Button1.ClientID %>").click();
document.getElementById("<%= UpdateProgress1.ClientID %>").style.display = "block";
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>Untitled Page</title>
</head>
<body onload="setTimeout('delayLoad()',3000)">
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                <div visible="true"><asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /></div>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
            <ProgressTemplate>
                Waiting..............
            </ProgressTemplate>
        </asp:UpdateProgress>
    </div>
    </form>
</body>
</html>

More informatin,see:Delaying Content Load using Timer and UpdatePanel

Thanks

Re: Controlling visibility of contents of collapsiblepanel

thomasabcd — Tue, 17 Jul 2007 23:01:54 GMT

Hi,

I know that, but then they are not rendered when the collapsilbe panel is expanded either.

-thomas

Re: Controlling visibility of contents of collapsiblepanel

n.ellsworth — Tue, 17 Jul 2007 18:37:14 GMT

Try

Sub Page_Load

panelName.visible = "false"

End Sub

This will make the panel invisible at runtime and not render the controls inside.

N.Ellsworth

Controlling visibility of contents of collapsiblepanel

thomasabcd — Tue, 17 Jul 2007 18:08:13 GMT

The contents of the panel which is collapsed are very large, so they take some time to load. I have set the collapsedsize to 0 but they are still displayed for some time before being collapsed. Is it in anyway possible to hide the contents totally at loadtime? I have tried setting "display:none" on the panel containing the content, but this didn't solve it. If there was a CollapsedEvent or DisplayedEvent on the collapsiblepanel, I could then hook up to this and remove "display:none".

Any ideas?