Replace User Control Inside PlaceHolder ASP.NET

Question

Ok, I've been searching for a couple hours on this topic now and nothing seems to look like a solution or even the same problem.

I have an aspx page with two content areas: a menu and a "MainContent" area which contains an UpdatePanel and a PlaceHolder. Currently, I can click the menu icons and it will swap out the different ascx pages into the "MainContent" section with no postback -- perfect.

The problem lies when I try to access another page from within one of those pages. Example: The List page shows a list of data rows where each row has two icons: View and Edit. Clicking View brings up a modal popup showing the complete data for the item. Clicking Edit takes you to the Edit page (ascx) for that item.

So here is the question: When I click Edit on that row (which is inside the UpdatePanel, inside the "MainContent" area) how can I get it to load the Edit page? Or am I just going about this completely the wrong way.

More clear example: Lets say the left menu has 3 items: Talking Points, People, and Map. You click on "People" and the "MainContent" area to the right loads a control that displays a list of Person entries each with a portion of the info related to them. Next to each Person entry is an Edit button. This Edit button should unload the "People" control in the "MainContent" area and replace it with the "EditPerson" control. Note that there are N number of Edit buttons on the page and they are part of each Person entry, so they cannot be positioned outside of the "People" control.

Answer 1

I've found the solution! This tutorial on user control events helped me substantially: http://asp.net-tutorials.com/user-controls/events/

Basically, all I did was add in a layer between the Placeholder and the View/Edit controls that handles the events and loading of each.

It basically just looks like this:

<%@ Register TagPrefix="uc" TagName="ViewMyControl" Src="stuff/ViewMy.ascx" %>
<%@ Register TagPrefix="uc" TagName="EditMyControl" Src="stuff/EditMy.ascx" %>

<asp:ScriptManagerProxy //stuff />
<asp:UpdatePanel //updatepanel stuff >
    <ContentTemplate>
        <uc:ViewMyControl runat="server" ID="ViewMyUserControl" OnEditItemClicked="ViewMyUserControl_EditItemClicked" Visible="true" />
        <uc:EditMyControl runat="server" ID="EditMyUserControl" OnSaveEditClicked="EditMyUserControl_SaveEditClicked" Visible="false" />
    </ContentTemplate>
    <Triggers> </Triggers>
</asp:UpdatePanel>

Then just adding in the appropriate event firing/handling methods as described in the tutorial.

Just to reiterate: the Placeholder control in the Master Page now loads this "Manage" ascx control when you click on the corresponding Menu item instead of going straight to the View control or the Edit control, and the Manage control now handles the loading/unloading of the View and Edit controls and their respective events.

Answer 2

Create these place holders/areas on the site.master page and make all other pages to inherit from the master page. This way you get your content place holder in all sub sequent pages. If this is not enough to get you started, I can give you a sample.

site.master

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <div >
            <your menu>
        </div>

        <div>
            <asp:ContentPlaceHolder  runat="server" ID="**MainContent**" />   
        </div>
    </ContentTemplate>

create default page,edit page and any otherpage to inherit from site.master

this 'MainContent' is your content place holder in all those pages. place your contents inside this

<asp:Content runat="server" ContentPlaceHolderID="**MainContent**">


</asp:Content>

Hope this helps