Question

首先见下图。

enter image description here

我们有一个侧边栏导航（ajax accordion control asp.net）

现在，当用户点击侧栏内相关页面（内容）内的链接时，应显示在内容到达区域。

根据给定的说明不应刷新整个页面，或者后退按钮中的其他词语不应该有效（在Internet Explorer中）。

实现此功能的方法应该是什么？

最佳建议应该是什么？

编辑导航树位于MasterPage内，内容去区域位于母版页的辅助内容页面

请建议我..... 非常感谢你....

Answer 1

最简单的方法是包裹你的侧导航＆amp; UpdatePanel中的内容占位符。将侧栏中的TreeView设置为更新面板的UpdateTrigger。但是，这种方法效率不高。

更好的方法是将内容占位符包装在更新面板中，同时包含HiddenField。在侧栏中选择后，使用JavaScript更新HiddenField值，然后刷新更新面板。

Answer 2

根据：

根据给定的指令，不应刷新整个页面，或者在后退按钮中的其他单词不起作用（在Internet Explorer中）。

和

侧边栏树视图位于主页面中，内容位于此处区域是内容页面

如果我的理解是正确的，我认为您不需要将TreeView控件放在母版页中，因为您只需要一个页面根据选择的内容动态加载内容你的树视图。那么......为什么这很重要？好吧，如果您将树视图放在页面中，可以使用UpdatePanel来避免发布完整帖子。

输出以下代码

enter image description here

以下代码涵盖了以下几点：

TreeView控件嵌入UserControl并置于ASPX页面（左侧）
菜单控件公开了所选节点更改时引发的事件，此事件在ASPX页面中处理，以根据页面右侧的用户选择动态加载用户控件，只有一个内容一次加载。
控件嵌入在UpdatePanel中，因此您不会更改页面，浏览器中的后退按钮也不会受到影响

注意：用户控件在帖子后面保持状态

（我不确定这是否是最好的方法，也许你可以尝试只使用ajax找到一个解决方案，并避免使用邪恶的updata面板，但当然这是一种方式要做到这一点）

我会尝试简化代码以减少帖子的大小，我只会发布一个用户控件的代码，另一个是完全相同的我只是改变了它的标题以区别于页面上

ASCX菜单

<asp:TreeView ID="TreeView1" runat="server" onselectednodechanged="Unnamed2_SelectedNodeChanged">
    <Nodes>
        <asp:TreeNode Text="link1" />
        <asp:TreeNode Text="link2" />
    </Nodes>
    <SelectedNodeStyle Font-Bold="True" Font-Italic="True" />
</asp:TreeView>

ASCX后面的菜单代码

    public event Action<string> MenuChanged = delegate { };

    protected void Unnamed2_SelectedNodeChanged(object sender, EventArgs e)
    {
        this.MenuChanged(this.TreeView1.SelectedNode.Text);
    }

ASPX

    <asp:ScriptManager runat="server" ID="sm" />
    <asp:UpdatePanel runat="server" ChildrenAsTriggers="true">
        <ContentTemplate>
            <asp:HiddenField runat="server" ID="currentControl" />
            <table border="0" cellpadding="0" cellspacing="0" width="90%" align="center">
                <tr>
                    <td style="width:50%; background-color: Silver">
                        <menu:TreeViewMenu runat="server" ID="myTreeViewMenu" OnMenuChanged="myTreeViewMenu_MenuChanged" />
                    </td>
                    <td style="width:50%; background-color: Aqua">
                        <p>Result:</p>
                        <asp:Panel runat="server" ID="myPanel">
                        </asp:Panel>
                        <asp:Label ID="lblMessage" runat="server" />
                    </td>
                </tr>
            </table>
        </ContentTemplate>
    </asp:UpdatePanel>

ASPX代码

    protected void Page_Init(object sender, EventArgs e)
    {
        if (this.IsPostBack)
        {
            var cc = this.Request.Form["currentControl"];

            if (!string.IsNullOrWhiteSpace(cc))
            {
                var uc = this.LoadControl(this.Server.HtmlDecode(cc));
                this.myPanel.Controls.Add(uc);
            }
        }
    }
    protected void myTreeViewMenu_MenuChanged(string e)
    {
        this.myPanel.Controls.Clear();

        switch (e)
        {
            case "link1":
                var cc1 = "~/Content1.ascx";
                this.currentControl.Value = this.Server.HtmlEncode(cc1);
                var uc1 = this.LoadControl(cc1);
                this.myPanel.Controls.Add(uc1);
                this.lblMessage.Text = "Updated from: link1";
                break;
            case "link2":
                var cc2 = "~/Content2.ascx";
                this.currentControl.Value = this.Server.HtmlEncode(cc2);
                var uc2 = this.LoadControl(cc2);
                this.myPanel.Controls.Add(uc2);
                this.lblMessage.Text = "Updated from: link2";
                break;
            default:
                this.lblMessage.Text = "Updated from default: " + e;
                break;
        }
    }

ASCX

<h1>Content 1</h1>

<asp:TextBox runat="server" ID="txt" />
<asp:Button Text="Process data..." runat="server" OnClick="button_Click" />
<asp:Button Text="Just post" runat="server" />

<asp:Label ID="lblMessage" runat="server" />

ASCX代码背后

    protected void button_Click(object sender, EventArgs e)
    {
        this.lblMessage.Text = this.txt.Text;
    }

您只需复制粘贴此代码即可自行测试，这应该可行

Answer 3

Jupaol的答案工作正常，但有一件事需要提及，我在实施了Jupaol的想法后遇到了问题，我点击菜单后第一次立即调用用户控件，ascx中的按钮工作正常，但如果我切换到第二个，第一次单击第二个控件上的按钮不会在第一次单击时触发，这是因为我们没有控件的“静态”ID。我花了将近3天的时间才弄清楚为什么会这样。所以这是我的代码的一部分。我要留下这条消息，希望之后阅读此内容的人都可以使用它。

if (!string.IsNullOrEmpty(controlPath))
{
    PlaceHolder1.Controls.Clear();
    UserControl uc = (UserControl)LoadControl(controlPath);

    /**note below LastLoadedControl is anything that could
     * be unique to the called control so every time when call back
     * it will not confuse the back end so the first fire of eg. a button
     * on that loaded control will work
     */
    uc.ID = LastLoadedControl;
    PlaceHolder1.Controls.Add(uc);
}

我还要感谢Jupaol的伟大贡献，以便我可以让我的网站运行。

在网页中加载特定部分？

3 个答案: