TabControl for ASP.Net

Posted Date: 23 Jul 2004	Resource Type: Articles	Category: ASP.NET/Web Applications
Author: Packiyanath.s.k	Member Level: Silver
Rating:	Points: 10

Download sample

Hi Guys...

I hope this article will be really bringing a big smile on the faces who are searching for a Tab Control kinda interface on a web page.

Yeah ! This is all abt creating a user interface with a Tab Control kind of look and feel. This is done using Microsofts IE Web Controls in the background.

Code goes this way... In the aspx page..
Put the below directive after Page directive...


<%@ Register TagPrefix="aspnetTab" 	
       Namespace="Microsoft.Web.UI.WebControls" 
       Assembly="Microsoft.Web.UI.WebControls" %>

Paste the following code inside Form Tag.

Put the whole code inside a Table .. Put the tabstrip inside a TR of a table and rest of the panels in one differnet single TR



<aspnetTab:tabstrip id="mytabstrip" runat="server" Width="338px" 
       Height="18px" Font-Size="8pt" AutoPostBack="True"
       TabSelectedStyle="background-color:CornflowerBlue;color:#000000;" 
       TabHoverStyle="background-color:#E0E0E0;color:#000000;"
       TabDefaultStyle="background-color:LightSteelBlue;text-align:center;">
       
<aspnetTab:Tab Text="Tab 1" DefaultImageUrl="imgs\1.gif"
       SelectedImageUrl="imgs\2.gif"></aspnetTab:Tab>

<aspnetTab:TabSeparator></aspnetTab:TabSeparator>

<aspnetTab:Tab Text="Tab 2" DefaultImageUrl="imgs\1.gif" 
       SelectedImageUrl="imgs\2.gif"></aspnetTab:Tab>

<aspnetTab:TabSeparator></aspnetTab:TabSeparator>
<aspnetTab:Tab Text="Tab 3" DefaultImageUrl="imgs\1.gif" 
       SelectedImageUrl="imgs\2.gif"></aspnetTab:Tab>
<aspnetTab:TabSeparator></aspnetTab:TabSeparator>
<aspnetTab:Tab Text="Tab 4" DefaultImageUrl="imgs\1.gif" 
       SelectedImageUrl="imgs\2.gif"></aspnetTab:Tab>
<aspnetTab:TabSeparator></aspnetTab:TabSeparator>
<aspnetTab:Tab Text="Tab 5" DefaultImageUrl="imgs\1.gif" 
       SelectedImageUrl="imgs\2.gif"></aspnetTab:Tab>
</aspnetTab:tabstrip>

Panel 1:


<asp:panel ID="pnl0" BorderColor="" Height="100%" BorderWidth="0" 
       Width="100%" Visible="False" Runat="server" 
       BackColor="CornflowerBlue">
</asp:panel>

Panel 2:

	
<asp:panel id="pnl1" Runat="server" Height="100%" Width="100%" 
       Visible="False" BorderWidth="0" BorderColor="" BackColor="CornflowerBlue">
</asp:panel>

...... so on till the no of Tabs you have added.

Note: You need to change the images(1.gif and 2.gif) that need to appear on the selected Tabs and the Tabs not selected that is given in the DefaultImageUrl and SelectImageURL attribute of Tab Items.

In The Code behind :

In mytabstrip_SelectedIndexChange Event... U can trap the Tab Pressed using "mytabstrip.SelectedIndex" and display the corresponding panel. Its your Logic to do it !!!

IMP
Go to this link to download the required reference....
http://www.asp.net/IEWebControls/Download.aspx?tabindex=0&tabid=1

Hope it was useful to you Guys !!

Thanks..
Packiyanath.sk.
Any Queries pls mail me @: packiyanath.sk@kmgin.com

Dream Big, Work Hard, Beleive in God, Good Things will Happen For Sure !!

Download sample

Responses

Author: biyanssa Diriba 13 Sep 2004 Member Level: Bronze Points : 0

having done what you have said, i have got the folloing error in my page. i am using vs.net 2003 version.
please can you tell me what is wrong with it? Thank you!

Parser Error
Description: An error occurred during the parsing of a resource required to service this request. Please review the following specific parse error details and modify your source file appropriately.

Parser Error Message: File or assembly name Microsoft.Web.UI.WebControls, or one of its dependencies, was not found.

Source Error:

Line 1: <%@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm1.aspx.vb" Inherits="WebTabControls.WebForm1"%>
Line 2: <%@ Register TagPrefix="aspnetTab"
Line 3: Namespace="Microsoft.Web.UI.WebControls"
Line 4: Assembly="Microsoft.Web.UI.WebControls" %>

Source File: D:\Projects\Web\ASP.NET\WebTabControls\WebForm1.aspx Line: 2

Assembly Load Trace: The following information can be helpful to determine why the assembly 'Microsoft.Web.UI.WebControls' could not be loaded.

=== Pre-bind state information ===
LOG: DisplayName = Microsoft.Web.UI.WebControls
(Partial)
LOG: Appbase = file:///D:/Projects/Web/ASP.NET/WebTabControls
LOG: Initial PrivatePath = bin
Calling assembly : (Unknown).
===

LOG: Policy not being applied to reference at this time (private, custom, partial, or location-based assembly bind).
LOG: Post-policy reference: Microsoft.Web.UI.WebControls
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/webtabcontrols/08850048/59181339/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/webtabcontrols/08850048/59181339/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///D:/Projects/Web/ASP.NET/WebTabControls/bin/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///D:/Projects/Web/ASP.NET/WebTabControls/bin/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/webtabcontrols/08850048/59181339/Microsoft.Web.UI.WebControls.EXE.
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/webtabcontrols/08850048/59181339/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.EXE.
LOG: Attempting download of new URL file:///D:/Projects/Web/ASP.NET/WebTabControls/bin/Microsoft.Web.UI.WebControls.EXE.
LOG: Attempting download of new URL file:///D:/Projects/Web/ASP.NET/WebTabControls/bin/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.EXE.

--------------------------------------------------------------------------------
Version Information: Microsoft .NET Framework Version:1.1.4322.573; ASP.NET Version:1.1.4322.573

Author: paul plop 16 Sep 2004 Member Level: Bronze Points : 0

For the Tabbed panel(that uses the Microsoft webcontrols) thang to work you need to include the .dll in a Bin folder on the root directory.

Author: neha 01 Oct 2004 Member Level: Bronze Points : 0

Hi,
I am trying to download Microsoft.Web.UI.WebControls from link given in this article but i am unable to get that dll.
I downloaded iewebcontol and executed build file but i coun't see
mocrosoft.web.ui.webcontrols.
Any help will be appreciated.
Thanks,
Neha

Author: Siva Prasad 06 Oct 2004 Member Level: Bronze Points : 0

Hi,

I found this article very interesting.but, i could c the .dll file that was mentioned to be found in build directory. Can u plz tell whats the resolution for this. i downloaded the iewebcontrols and installed. but, couldnt find the .dll file.

thanx,
bye
Siva

Author: Kevin 11 Oct 2004 Member Level: Bronze Points : 0

How do you edit the build.bat file to put the path for csc.exe file. Save the file and run it to get the DLL. cuz i got an error of
File or assembly name Microsoft.Web.UI.WebControls, or one of its dependencies, was not found.

I'm new at ASP.Net programming. I have installed the controls and put it in the correct place, like putting the Microsoft.Web.UI.WebControls.DLL in the bin folder... however i still gotten an error message saying File or assembly name Microsoft.Web.UI.WebControls, or one of its dependencies, was not found. I would really apprecite it if somebody can help me out, thank you.

Source File: c:\inetpub\wwwroot\sampleapp\multipage.aspx Line: 2

Assembly Load Trace: The following information can be helpful to determine why the assembly 'Microsoft.Web.UI.WebControls' could not be loaded.

=== Pre-bind state information ===
LOG: DisplayName = Microsoft.Web.UI.WebControls
(Partial)
LOG: Appbase = file:///c:/inetpub/wwwroot
LOG: Initial PrivatePath = bin
Calling assembly : (Unknown).
===

LOG: Policy not being applied to reference at this time (private, custom, partial, or location-based assembly bind).
LOG: Post-policy reference: Microsoft.Web.UI.WebControls
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/root/2135a508/8d69a834/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/root/2135a508/8d69a834/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///c:/inetpub/wwwroot/bin/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///c:/inetpub/wwwroot/bin/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.DLL.
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/root/2135a508/8d69a834/Microsoft.Web.UI.WebControls.EXE.
LOG: Attempting download of new URL file:///C:/WINDOWS/Microsoft.NET/Framework/v1.1.4322/Temporary ASP.NET Files/root/2135a508/8d69a834/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.EXE.
LOG: Attempting download of new URL file:///c:/inetpub/wwwroot/bin/Microsoft.Web.UI.WebControls.EXE.
LOG: Attempting download of new URL file:///c:/inetpub/wwwroot/bin/Microsoft.Web.UI.WebControls/Microsoft.Web.UI.WebControls.EXE.

Author: Packiyanath.s.k 12 Oct 2004 Member Level: Silver Points : 0

Did u try with the demo I attached to this. ?

That has the dll in the right place.. !

Check that. Mail me if u have prblms.

Author: pranaya 21 Feb 2005 Member Level: Bronze Points : 0

I downloaded the sample.
when I executed the progrm, I am not getting any errors but , the functionality is not being getting

Author: kalyan p 22 Aug 2007 Member Level: Bronze Points : 0

Hi i am using Tabstrip control in IE webcontrol i want to hide and show the tabs based on the condition.how to make visible true or false to the tabs in tabcontrol dynamically.can you help me...

thanks
kalyan

Feedbacks

Popular Tags

What are tags ?

Search Tags

(No tags found.)

Post Feedback

This is a strictly moderated forum. Only approved messages will appear in the site. Please use 'Spell Check' in Google toolbar before you submit.
You must Sign In to post a response.

	Next Resource: New features in ASP.NET 2.0
	Previous Resource: Response.Redirect is not working?? Check out your form may be posted more than Once !!
	Return to Discussion Resource Index
	Post New Resource
	Category: ASP.NET/Web Applications

Post resources and earn money!

Related Resources