Ok, now add a new "Web Content Form", and select
the "Master Page" that you just created. In your "Web Content
Form", you should see the two "ContentPlaceHolder" controls from
the "Master Page".
Within the 1st "ContentPlaceHolder" put a table
that has a few rows with some link button controls like this:
Listing 3
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<table style="width:160px;vertical-align:top;">
<tr>
<td style="vertical-align:top">
<asp:LinkButton ID="lb1" runat="server" OnClick="lbPanelShow_Click">lb1</asp:LinkButton>
</td>
</tr>
<tr>
<td>
<asp:LinkButton ID="lb2" runat="server" OnClick="lbPanelShow_Click"> lb2 </asp:LinkButton>
</td>
</tr>
<tr>
<td>
<asp:LinkButton ID="lb3" runat="server" OnClick="lbPanelShow_Click"> lb3</asp:LinkButton>
</td>
</tr>
<tr>
<td>
<asp:LinkButton ID="lb4" runat="server" OnClick="lbPanelShow_Click"> lb4</asp:LinkButton>
</td>
</tr>
</table>
</asp:Content>
We will work on the lbPanelShow_Click method when we get to
the code behind.
Now we will add the section to the right where our content
is going to go. We will add a panel for each of our link buttons:
Listing 4
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
<table style="width:640px">
<tr>
<td>
<asp:Panel ID="pnl1" runat="server" Visible="false">
Panel 1
</asp:Panel>
<asp:Panel ID="pnl2" runat="server" Visible="false">
Panel 2
</asp:Panel>
<asp:Panel ID="pnl3" runat="server" Visible="false">
Panel 3
</asp:Panel>
<asp:Panel ID="pnl4" runat="server" Visible="false">
Panel 4
</asp:Panel>
</td>
</tr>
</table>
</asp:Content>
Ok, now that we have our UI Together, we can go to the code
behind.