Introduction: In this article I have try to explain how we can use the TabContainer Ajax control in Asp.net.

Description:

In the last article I have explained How to install Ajax control Toolkit in Visual Studio, How to useAutoCompleteExtender Ajax control in Asp.net, How to Upload multiple filesusing AjaxFileUpload and save path to database in Asp.net.

We use the TabContainer Control to show/display the a lot of information on one page. TabContainer contain the set of Tabs. TabPanel define HeaderText and ContentTemplate.

 Add a new webform to project. Drag and drop the TabContainer Control from Toolbox. Design your page as shown below:

    <div style=" width:30%">

        <asp:ScriptManager ID="ScriptManager1" runat="server">

        </asp:ScriptManager>

        <asp:TabContainer ID="TabContainer1" runat="server">

        <asp:TabPanel ID="tab1" runat="server" HeaderText="Employee Detail">

        <ContentTemplate>

        <table align="right"><tr><td><img src="Upload_Images/Thumb/ff9eb48c-e83e-4d55-9d86-6dd405421df3.png" /></td></tr></table>

        <table>

        <tr><td>Employee Name:</td><td>Rakesh</td></tr>

        <tr><td>Address:</td><td>#1219 Sec 40B CHD</td></tr>

        <tr><td>City:</td><td>Chandigarh</td></tr>

        <tr><td>Phone No.:</td><td>1523451245</td></tr>

        </table>

        </ContentTemplate>

        </asp:TabPanel>

        <asp:TabPanel ID="tab2" runat="server" HeaderText="Employee Qualification">

        <ContentTemplate>

        <table>

        <tr><td>Professional Qualification:</td><td>B.Tech.</td></tr>

        <tr><td>College Name:</td><td>ABCDE</td></tr>

        <tr><td>University:</td><td>ABCD</td></tr>

        <tr><td>Percentage:</td><td>85%</td></tr>

        </table>

        </ContentTemplate>