Wednesday, March 28, 2012

System.Web.UI.UserControl does not have a public property named Title.

The controls work but I cannot view them in designer I get an error:

Error 1 Content1:Type 'System.Web.UI.UserControl' does not have a public property named 'Title'. D:\asp.net\Atlas\SampleWebSite\ModalPopup\ModalPopup.aspx D:\...\SampleWebSite\

I saw another post that said to rebuild, but I tried that and it didn't work.

thanks!

Nevermind... found the answer to remove the collapible panels. Wait until next release.

System.Web.UI.UpdatePanel does not have a public property named UpdatePanelAnimationExtend

'System.Web.UI.UpdatePanel' does not have a public property named 'UpdatePanelAnimationExtender'.

I have nothing but problems with ASP.Net AJAX. Could somebody tell me what is going on?

Newbie

The updatepanel doesn't have a public property named that - you have to use the AjaxToolkit to get that animation feature...

http://www.codeplex.com/AtlasControlToolkit

and from the sample website this is the code:

<%@.Page

Language="C#"

MasterPageFile="~/DefaultMaster.master"

AutoEventWireup="true"

CodeFile="UpdatePanelAnimation.aspx.cs"

Inherits="UpdatePanelAnimation_UpdatePanelAnimation"

Title="UpdatePanelAnimation Sample" %>

<%@.Register

Assembly="AjaxControlToolkit"

Namespace="AjaxControlToolkit"

TagPrefix="ajaxToolkit" %>

<asp:ContentContentPlaceHolderID="SampleContent"Runat="Server">

<asp:ScriptManagerrunat="server"EnablePartialRendering="true"/>

<divclass="demoarea">

<divclass="demoheading">UpdatePanelAnimation Demonstration</div>

<divstyle="margin-bottom: 10px;">

<divstyle="border: dashed 1px #222222;">

<divid="up_container"style="background-color: #40669A;">

<asp:UpdatePanelID="update"runat="server">

<ContentTemplate>

<divid="background"style="text-align: center; vertical-align: middle; line-height: 44px; padding: 12px; height: 44px; color: #FFFFFF;">

<asp:LabelID="lblUpdate"runat="server"Style="padding: 5px; font-size: 14px; font-weight: bold;">

4/28/1906 12:00:00 AM

</asp:Label>

</div>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTriggerControlID="btnUpdate"EventName="Click"/>

</Triggers>

</asp:UpdatePanel>

</div>

</div>

</div>

Choose the effects, then press 'Update':<br/>

<inputtype="checkbox"id="effect_fade"checked="checked"/><labelfor="effect_fade">Fade</label><br/>

<inputtype="checkbox"id="effect_collapse"checked="checked"/><labelfor="effect_collapse">Collapse</label><br/>

<inputtype="checkbox"id="effect_color"checked="checked"/><labelfor="effect_color">Color Background</label><br/>

<asp:ButtonID="btnUpdate"runat="server"Text="Update"OnClick="btnUpdate_Click"/>

<ajaxToolkit:UpdatePanelAnimationExtenderID="upae"BehaviorID="animation"runat="server"TargetControlID="update">

<Animations>

<OnUpdating>

<Sequence>

<%-- Store the original height of the panel --%>

<ScriptActionScript="var b = $find('animation'); b._originalHeight = b._element.offsetHeight;"/>

<%-- Disable all the controls --%>

<Parallelduration="0">

<EnableActionAnimationTarget="ctl00_SampleContent_btnUpdate"Enabled="false"/>

<EnableActionAnimationTarget="effect_color"Enabled="false"/>

<EnableActionAnimationTarget="effect_collapse"Enabled="false"/>

<EnableActionAnimationTarget="effect_fade"Enabled="false"/>

</Parallel>

<StyleActionAttribute="overflow"Value="hidden"/>

<%-- Do each of the selected effects --%>

<Parallelduration=".25"Fps="30">

<ConditionConditionScript="$get('effect_fade').checked">

<FadeOutAnimationTarget="up_container"minimumOpacity=".2"/>

</Condition>

<ConditionConditionScript="$get('effect_collapse').checked">

<ResizeHeight="0"/>

</Condition>

<ConditionConditionScript="$get('effect_color').checked">

<ColorAnimationTarget="up_container"PropertyKey="backgroundColor"

EndValue="#FF0000"StartValue="#40669A"/>

</Condition>

</Parallel>

</Sequence>

</OnUpdating>

<OnUpdated>

<Sequence>

<%-- Do each of the selected effects --%>

<Parallelduration=".25"Fps="30">

<ConditionConditionScript="$get('effect_fade').checked">

<FadeInAnimationTarget="up_container"minimumOpacity=".2"/>

</Condition>

<ConditionConditionScript="$get('effect_collapse').checked">

<%-- Get the stored height --%>

<ResizeHeightScript="$find('animation')._originalHeight"/>

</Condition>

<ConditionConditionScript="$get('effect_color').checked">

<ColorAnimationTarget="up_container"PropertyKey="backgroundColor"

StartValue="#FF0000"EndValue="#40669A"/>

</Condition>

</Parallel>

<%-- Enable all the controls --%>

<Parallelduration="0">

<EnableActionAnimationTarget="effect_fade"Enabled="true"/>

<EnableActionAnimationTarget="effect_collapse"Enabled="true"/>

<EnableActionAnimationTarget="effect_color"Enabled="true"/>

<EnableActionAnimationTarget="ctl00_SampleContent_btnUpdate"Enabled="true"/>

</Parallel>

</Sequence>

</OnUpdated>

</Animations>

</ajaxToolkit:UpdatePanelAnimationExtender>

</div>

<divclass="demobottom"></div>

System.Web.UI.UpdatePanel does not have a public property named Login

I am trying to wrap an updatepanel in a login wizard and it is giving me the error described in the subject.

Am I doing something incorrectly.

From other posts that I have read this is possible.

Does anyone have an ideas.

It would be greatly appreciated.

it must be inside of<ContentTemplate>from theUpdatePanel, did you checked that?
Thanks for the information

Try this

<asp:UpdatePanel ID="UpdatePanel 1" UpdateMode="Conditional" runat="server">
<ContentTemplate>

<asp:Login ID="Login1" runat="server" ></asp:Login>

</ContentTemplate>
</asp:UpdatePanel>

System.Web.UI.Timer interval in client side code

Has anyone successfully set the Interval property in a System.Web.UI.Timer control using client side scripting of any language?

var timer = $find('<%= Timer1.ClientID %>');
timer.set_interval(5000);

FYI, some other methods are:

timer.get_interval();
timer._startTimer();
timer._stopTimer();
timer.set_enabled(true/false);


If this works I owe you a pretend steak dinner. Spent all day yesterday trying to track this down.


Big Smile Let me know if it does. I like my pretend steaks done pretend medium.


Okay so at first it didn't work. So I started experimenting.

It works when there's no master page, and just one single page, and the script is inside the page, call this TestSingle.aspx.

So I moved it to the child page, the timer resides on the child page, and put the script inside the child page and it works, call this Child.aspx.

So then I moved the script to the outside file that is loaded by the master page into every page and the function fails to find Timer1.

So then I used TestSingle.aspx again, and this time loaded the function from an outside .js file, and it failed to find Timer1.

Long story short, it works, but if it's trying to access Timer1 via script in an outside file, it fails to find Timer1. Is there some qualifier I need now?


Can you post the contents of your .js file as well as the source code where you reference it in the master page?


The only thing I put in the .js file was:

function StopTimer()
{
alert(1);
var timer = $find('<%= Timer1.ClientID %>');
alert(timer);
//timer.set_interval(5000);
alert(timer.get_interval());
//timer._stopTimer();

}

<%@. Page Language="C#" AutoEventWireup="true" CodeBehind="TestSingle.aspx.cs" Inherits="Website.TestSingle" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title><script src="./script/Test.js" type="text/javascript"></script> </head><body> <form id="form1" runat="server"> <div>   <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> </div> <asp:Timer ID="Timer1" runat="server"> </asp:Timer> <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="StopTimer()" /> </form></body></html>

That setup fails to find Timer1, not even using a master child setup.


Take out the <script src="./script/Test.js" type="text/javascript"></script> and reference it via your script manager control.

<asp:ScriptManagerID="ScriptManager1"runat="server">
<Scripts>
<asp:ScriptReferencePath="./script/Test.js"/>
</Scripts>
</asp:ScriptManager>


Nope didnt work.


Sorry I didn't catch it the first time around...

In the .js file you can't use the <%= %> notation. That is strictly an ASP.NET thing. The only thing that can be in the .js file is pure javascript. So you want it to look like:

var timer = $find('Timer1');

$find() does take a second, optional parameter that allows you to specify the parent of the component you're looking for. That basically serves the same purpose as requiring it to use the ClientID of the control. You can read more about that here: http://www.asp.net/AJAX/Documentation/Live/ClientReference/Sys/ApplicationClass/SysApplicationFindComponentMethod.aspx


You can't use inline server script in your JavaScript include files. So, $find('<%= Timer1.ClientID %>') is literally looking for a control with the client ID of<%= Timer1.ClientID %>.

I'd set a JavaScript variable in pageLoad() with the Timer's ClientID and then reference that in the included script.


So how does one access the Client ID from javascript? <% ClientID %> ?


OnClientClick="StopTimer(<%= Timer1.ClientID %>)"

function StopTimer(args) {
var timer = $find(args);
timer.set_interval(5000);
}


Well yeah that achieves stopping it with a button. But in actuality what I'm going to do is "onfocus" on a TextBox/ComboBox/Etc. call StopTimer, and on a onblur turn it back on. This naturally has to happen within a millisecond, and be extremely easy to code into the project. ie StopTimer and StartTimer exists in a separate file and I just past "onfocus=StopTimer() onblue=StartTimer()" into the <input>'s, or in the pageload set attributes for windows controls.

So yeah, I could put that function you wrote in the outside .js file and just have the function take a parameter. But that's gonna make the HTML even bigger then it is already, although that should work.

And every child has TimerTicker added to it programmatically from the inherited root class every child page inherited. That way I dont have to manually add it to every child page someone makes, this solution is already at 30 child pages based off same master.


Yeah it's not finding hte control even with the args method you posted. It's acutally erroring out and giving syntax error. Adding ' ' to either side on StopTimer('<%= Timer1.ClientID %>') just sends the string to the method.

System.Web.UI.ScriptManager not recognized

Hi All,

First of all I am new to using Ajax controls, and am having a bit of trouble trying to add them to an exsisting ASP.NET application.

I am using:

Windows Vista Business

IIS7

VS 2005 SP1

AJAX 1.0

When trying to add an Ajax script manager to a page i get an error in the designer.vb file saying that the System.web.ui.scriptmanager type is not recognized. Also when I try to run the app I get the "sys is not found" javascript error which I would expect is related to my issue.

I have searched the fourms etc for quite a while and have found one other post regarding this, although it didn't seem to solve my problem.

I have tried running a Ajax enabled project and tested it in both the VS and IIS webservers which works well. I have also copied a web.config file from an Ajax enabled site so I dont think it is the web.config file.

Could anyone shed some light on this?

Thanks in advance.

Glen

http://www.emmersivemedia.com.au

First of all When u create "AJAX Enabled Site", You don't have to manually include

ScriptManager Control. It will be automatically placed on the form.


Why do you want to place ScriptManager manually ?

You can use directly AJAX Enabled Web Site..


Hi Chetan,

I am adding Ajax controls to a "Standard" ASP.NET application and not a Ajax enabled app, when adding the control which i want to use (ModalPopup) it says that it requires an instance of the ScriptManager Control on the page which makes sense as to my understanding any page that uses Ajax controls needs a ScriptManager control or a ScriptManager Proxy.

The reason I mentioned the Ajax Enabled site is that I guess it illustrates the fact that its not a problem with the instalation of Ajax but rather an issue specifically with the app i am working with.

Can you think of anything that I might have missed that would cause this to happen?

Thanks again for your help.

Regards,

Glen

System.Web.UI.WebControls.Menu and UpdatePanels / WebParts

Hi,

(using April version of Atlas)
I have a web form with a script manager, a web part manager, a menu and a web part zone with a generic web part in it. An update panel is around the web part manager and the web part zone. When I click on the arrow for the popup web part menu and chose for example "minimize", everything works fine for the first time, until the web part is rendered: When I want to click once again on the arrow for the popup web part menu, nothing happens anymore (nothing = no popup of the menu). This is just because of the System.Web.UI.WebControls.Menu on the page. When I remove the System.Web.UI.WebControls.Menu, everything works normal.

I made a sample code, to reproduce the problem:

<%@dotnet.itags.org. Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb"Inherits="_Default" %><!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <atlas:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"/> <div> <atlas:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:WebPartManager ID="WebPartManager1" runat="server"> </asp:WebPartManager> </ContentTemplate> </atlas:UpdatePanel> <br /> <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal"> <Items> <asp:MenuItem Text="Neues Element" Value="Neues Element"> <asp:MenuItem Text="Neues Element" Value="Neues Element"> <asp:MenuItem Text="Neues Element" Value="Neues Element"></asp:MenuItem> </asp:MenuItem> <asp:MenuItem Text="Neues Element" Value="Neues Element"></asp:MenuItem> </asp:MenuItem> <asp:MenuItem Text="Neues Element" Value="Neues Element"> <asp:MenuItem Text="Neues Element" Value="Neues Element"></asp:MenuItem> </asp:MenuItem> </Items> </asp:Menu> <br />  </div> <atlas:UpdatePanel ID="UpdatePanel2" runat="server"> <ContentTemplate> <asp:WebPartZone ID="WebPartZone1" runat="server"> <ZoneTemplate> <asp:Calendar ID="Calendar1" runat="server"></asp:Calendar> </ZoneTemplate> </asp:WebPartZone> </ContentTemplate> </atlas:UpdatePanel> </form> </body></html>

ASH123,

I am having the same issue. I found that if you set WebPartVerbRenderMode to TitleBar, you are allowed to minimize/restore the webpart multiple times.

Did you ever find a solution that doesn't involve this work around?

Thanks

system.webServer and sys is undefined

Hi,

I know this has been on the table before but I've been struggling with "sys is undefined" when running in IIS7 Integrated mode for a while now and it would be great to get a good answer from MS (or someone else) about this. Classic mode works just fine. There are 5000 different "solutions" available in the forums and the only thing I've managed to get to work is removing the <handlers> section under <system.webServer>. The application still works as expected. Aren't these lines required? They already exist in <httpHandlers> below <system.web>.

When I accesshttp://localhost/test/ScriptResource.axd with the <handlers> still there I get:

Description: Handler "ScriptResource" has a bad module "ManagedPipelineHandler" in its module list
Error Code: 0x8007000d
Notification: ExecuteRequestHandler
Module: IIS Web Core
Requested URL:http://localhost:80/test/ScriptResource.axd
Physical Path: C:\Projects\test\web\ScriptResource.axd
Logon User: domain\user
Logon Method: Negotiate
Handler: ScriptResource

When I remove the section the application works but I get 404 instead when accessinghttp://localhost/test/ScriptResource.axd.

Can someone please explain or point me in the right direction?

Many thanks,
Manso

Hi,

Please refer to this thread:http://forums.asp.net/p/1048901/1504197.aspx#1504197

Hope this helps.

System.WebForms.PageRequestManagerParserErrorException The message revieved from the serve

I am trying to use update panel's feature to asyncronously postback and update the data in one of my grid. I am using Master Page and ASPX and a User Control that actually contains the button, Update Panels and a Grid.

When I click btnRefresh I get the following error:

System.WebForms.PageRequestManagerParserErrorException The message revieved from the server could not be parsed...

My ascx looks like this:

<asp:ScriptManagerID="ScriptManager1"runat="server">
</asp:ScriptManager>

<asp:UpdatePanelID="UpdatePanel1"runat="server"UpdateMode="Conditional">
<ContentTemplate>
<asp:ImageButtonID="btnRefresh"runat="server"ImageUrl="~/refresh.gif"OnClick="ImageButton1_Click"/>
</ContentTemplate>
</asp:UpdatePanel>

<asp:UpdatePanelID="UpdatePanel2"runat="server">
<Triggers>
<asp:AsyncPostBackTriggerControlID="btnRefresh"/>
</Triggers>
<ContentTemplate>
<igtbl:UltraWebGridID="UltraWebGrid1"runat="server"Height="200px"Width="468px"style="left: 1px; top: 226px">
</igtbl:UltraWebGrid>
</ContentTemplate>
</asp:UpdatePanel>

Could someone please suggest on this? Is the problem with User Controls??

Guys,

I added the script manager in my Master Page and then added scriptManagerProxy at my user controls which resolved the problem.

Cheers,

Ashish

Sytem.Drawing.ToolboxBitmapAttribute

I have a simple page that uses the UpdatePanel and runs fine locally, but when uploaded to a Windows 2003 server with .NET 2.0 and AJAX Extensions 1.0 installed I get the following error:

"The type initializer for 'System.Drawing.ToolboxBitmapAttribute' threw an exception."

As far as I understand it, that part of the framework is for Windows Forms. This is an ASP.NET website. Any ideas?

Ashiki:

"The type initializer for 'System.Drawing.ToolboxBitmapAttribute' threw an exception."

As far as I understand it, that part of the framework is for Windows Forms. This is an ASP.NET website. Any ideas?

The ToolboxBitmapAttribute is used for all ServerControls with an UI to show an icon in the VS ToolBox. Maybe it helps to register the System.Web.Extensions.Design.dll in the web.config on youre Server because the UpdatePanel has a reverence in his Attributes to the resources in this assembly. Reflector shows the classdeffinition as follows.

[

Designer("System.Web.UI.Design.UpdatePanelDesigner, System.Web.Extensions.Design, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"),ToolboxBitmap(typeof(EmbeddedResourceFinder),"System.Web.Resources.UpdatePanel.bmp"),DefaultProperty("Triggers"),ParseChildren(true),PersistChildren(false),AspNetHostingPermission(SecurityAction.LinkDemand,Level=AspNetHostingPermissionLevel.Minimal),AspNetHostingPermission(SecurityAction.InheritanceDemand,Level=AspNetHostingPermissionLevel.Minimal)]

Hope that helps


I see - the web.config automatically generated by VS for an AJAX site has this already in the web.config:

<

assemblies>

<

addassembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

</

assemblies>

I'd never noticed that before, and I guess its there for the reason you give. I've tried adding a reference for System.Web.Extensions.Design as well, just in case, but I still get the same error on the server.


In youre first posting you write: "Thetype initializer for 'System.Drawing.ToolboxBitmapAttribute' threw an exception"!

If it possible, debug the App on the Server to see where exactly the Exception is thrown.

I think the Exception is thrown on this point:ToolboxBitmap(typeof(EmbeddedResourceFinder),

If so, you see more Information in the stack.

Hope that helps.


I can run the website from VS installed on the server and there are no errors at all - it runs fine. When I access the site externally from a browser though I still get the error. Is it a permissions thing?

Well, after many trial and error attempts at a fix I finally uninstalled AJAX Extensions, installed SP2 for Windows 2003, deleted the website from IIS, re-installed AJAX, recreated the website and now its all running OK.


Hello, I have the same error since 2 days on my server. I have a dropdown list .

http://www.laposturologie.com/testbug.aspx

Pleaaaaaase help


I never found out what that error message means, but once I had done the uninstall and re-install as in my post above I've never seen the error again.


godaddy don't want to help me about that error

they told me it is in my code...there's nothing wrong in my code because i have changed nothing and then this error came up.

u can see the page :

http://www.carteinter.com/testbug.aspx

this error happens only when there is a gridview and an sql datasource

u can see the working page

http://www.carteinter.com/testbug.aspx


mistake in last post

the working page is

http://www.carteinter.com/Main.aspx

the page not working is

http://www.carteinter.com/testbug.aspx


I'm having this problem as well. It's only on the host and it happens with both a GridView and a DataList. I'm using an ObjectDataSource instead of a SQLDataSource, but it seems like it's the GridView (not the data source) that's causing the grief. I've removed everything else that could be causing this problem. I just have a class with a static method that gets some rows from the DB and puts them in a DataSet. I've set this as the SelectMethod for my ObjectDataSource and bound the GridView to the ObjectDataSource.

I get the parser error with this simple page (2 controls, nothing else).

Unfortunately, like others have mentioned - since I am on a host (GoDaddy) I can't just reinstall, reboot, delete temporary IIS files, or reset IIS. I did change things several times so the app got recycled, but I've continued to have problems.

Its pretty clear something to do with the server control is not functioning properly and it would be nice to get a little help from someone at Microsoft. Those of us on external hosts are pretty much stuck here. I can rewrite the code to display all this by hand (using codebehind) but that will take a lot of work.


CHANGE HOST ASAP!!!!!!!!!!!

GODADDY REALLY SUCKS !!

THEY CAN'T FIX A BUG, THERE ARE POOR IN TECHNICAL SUPPORT, THERE ARE SURELY A LOT OF USERS THAT HAVING THIS PROBLEM

IM NOT THE ONLY ONE AS U CAN SEE...

I HAVE CHANGED HOST AND NOW MY WEB SITE WORKS FINE

U CAN TAKE A LOOK :

WWW.CARTEINTER.COM

tab

how can i use tab control that is NEW on AjaxWEBsite Sample?

Maybe...look at the sample web site page which shows you how to use it!

Tab and Enable

Hello

I′m using the tab component and i would like to know how can i disable all the controls inside a tab automatically avoding editing.

Best regards,

Borja

could you not just loop through all the controls in the tabcontainer?

for each ctl as Control in tabcontainer.controls

ctl.enable=false

next

?


What′s the difference between enable and visible in the tab?


I believe enable=false will just gray out the tab and make it unselectable, where as visible=false will make it disappear completely.


Put all the controls you want to disable in a panel for example, and disable the panel? All the controls inside it will be disabled..


As he said, disabled controls (enabled=false) will be grayed out, while controls with visible=false will not be visible at all for the user. Which is also not the same as using style="display:none;" nor style="visibility:hidden;"... If you are gonna toggle between hiding and showing stuff, I recommend the last techniques as you can show/hide simply with css. (don't use style="", but rather define it in css if possible)

Tab Back Color

Anyone having problems setting the back color on a tab? The tab remains white no matter what.Yes i have the same problem. I cannot change the back color. I've tried to create my own CSSClass but when i'm trying to link my tab contol on my cssclass it doesn't work at all.

tab and IE 7

I am a bit miffed. I am trying to get the ajax tab control to work and I am running into some issues with IE7. The style doesn't show up in IE7 if I access the page from my web server. The style shows up just fine using Firefox if I access the page from the web server. The style shows up if I access the page using the web server with Visual Studio. Why does the same page work locally and not from a production web server? All I can see in IE7 from the production web server is the tab headers which still work if I click on them.After further testing I discoverd that the ajax tab control only works if it's in the root directory for the site on the production server.

I m having problem to get right view in IE 7, while on firefox it runs fine.

I want to apply ajax tab control not on root directory but inside folder can anyone help me.

Tab container - Progressive enhancement

I am new to AJAX and the control toolkit.

I read about "Graceful degradation/Progressive enhancement" on another site and I am wondering how I can code for it when I use a tab container. I was testing with the AJAX tab container/tab panel but when I disable javascript in the browser, the page with the tab is blank. On some sites using tabs, the result of turning javascript off is different. The page shows atleast the first tab's information but nothing happens when the second tab is selected.

I realize I can add a message - "this site needs javascript to be turned on" or redirect the user to another page if javascript is disabled. I am wondering if there is anything else I can do so the page does not show up blank.

Thanks!

Hi,

May be you can try this.

Add a pure text-based header, set its visibility to hidden via javascript on load.

So that it will be visible if the javascript is disabled.

Hope this helps.


The Toolkit is not supported to work if javascript is turned off. The behavior may not be tuned to gracefully degrade and it is not a scenario we plan to solve since the Toolkit controls all operate in client side ASP.NET AJAX behaviors which need javascript to be turned on and it may be hard to do the same. If you are using the Toolkit on sites which may be expected to work when javascript is turned off then it may need to be taken care of in your code.

Tab container

hi all,

i have placed the tab container in side a datagrid. tab container will appear in the item command of datagrid. if i set the active tab index as zero. i got some error.

57 line 17 char

argument out of range exception

1495 line 38 char

this.get_element().style is null or not an object.

if i remove that active tab index property tab container works fine.

how to close the tab container?

please help me

Balaji

Hi Balaji,

Can you show me your relevant code so that I can reproduce your issue?
A stripped simpler version of your code would be better.

Looking forward to your reply.

hi,

here is my code snippet

protectedvoid dlHostels_ItemCommand(object source,DataGridCommandEventArgs e)

{

tabcontainer tbc=new tabcontainer();

tbc = (TabContainer)dlHostels.Items[e.Item.ItemIndex].FindControl("TabContainer1");

Label lblInfo =newLabel();

TabPanel tp = new tabpanel();

tp.controls.add(lblinfo);

tbc.controls.add(tp);

//i have added three panels to this tabcontainer.

tbc.activetab=0; // problem with this tabindex. if i didnt mention anything then it works fine.

}

tab container

hai

i had a tabcontainer.i want to do some server side events when tab index changed.but when i change the tabindex the tab container disappears.how to solve this.i am using ie 6 and asp.net 2.0.i had set the autopost back property of tabcontainer to true.

please sort this issue out.

thanks in advance.

regards

mugil

You can use this approach...http://blogs.msdn.com/sburke/archive/2007/06/13/how-to-make-tab-control-panels-load-on-demand.aspx

-Damien


Hi Mugil,

Has your problem been resolved yet? If yes, would you please mark it as "answered". Otherwise, please provide your simple sample which contains your issue. Generally, your problem is not occurred in your scene so we really need your code.

Best regards,

Jonathan


Hi Mugil,

Here is an sample. Please compare it with yours.

<%@. Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
<script runat="server"
protected void TabContainer1_ActiveTabChanged(object sender, EventArgs e)
{

}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<ajaxToolkit:TabContainer ID="TabContainer1" runat="server" AutoPostBack="true" OnActiveTabChanged="TabContainer1_ActiveTabChanged">
<ajaxToolkit:TabPanel ID="TabPanel1" runat="server">
<HeaderTemplate>
Tab1</HeaderTemplate>
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</asp:Panel>
</ContentTemplate>
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="TabPanel2" runat="server" >
<HeaderTemplate>
Tab2</HeaderTemplate>
<ContentTemplate>
<asp:Panel ID="Panel2" runat="server" Height="200" Width="100%" style="overflow:auto">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</asp:Panel>
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
</form>
</body>
</html>
If it doesn't work, please check your system environments. We suggest that you should upgrade your Ajax Control Toolkit to the latest version. (10618 or 10920).

Hope this helps.

Best regards,

Jonathan.

Tab Container

I have seen the tab container inside an update panel and with out any update panels.

Which is correct?

Thank!

Dennis4j,

The only reason I put the TabContainer inside of an UpdatePanel is when I have an "editable" GridView inside one of the tabs. I can't remember where I read this, but in order for the tab control to keep track of the correct tab when the grid goes into edit mode this had to be done. I think it was logged as a bug but I don't have the details handy.

Regards.

Tab Container Custom Style in Firefox...

Hi,

I am using a TabContainer with a custom CSS file. I have copied the original CSS file and have modified it a little. Here is the CSS I am using:

/* xp theme */

/* Our Additions */

.StpAjaxTab

{

margin-left:auto;margin-right:auto;

}

.StpAjaxTab.ajax__tab_header

{

font-family:verdana,tahoma,helvetica;font-size:11px;

/* Our Additions */

border-bottom:solid1px#000000;text-align:left;

}

.StpAjaxTab.ajax__tab_outer

{

padding-right:4px;height:21px;

}

.StpAjaxTab.ajax__tab_inner

{

padding-left:3px;

/* Our Additions */

border:solid1px#000000;

}

.StpAjaxTab.ajax__tab_tab

{

height:13px;

padding:4px;

margin:0;

}

.StpAjaxTab.ajax__tab_hover.ajax__tab_outer

{

}

.StpAjaxTab.ajax__tab_hover.ajax__tab_inner

{

/* Our Additions */background-color:#DDDDDD;

}

.StpAjaxTab.ajax__tab_hover.ajax__tab_tab

{

/* Our Additions */background-color:#DDDDDD;

}

.StpAjaxTab.ajax__tab_active.ajax__tab_outer

{

}

.StpAjaxTab.ajax__tab_active.ajax__tab_inner

{

/* Our Additions */

background-color:#DDDDDD;

border:solid1px#000000;

}

.StpAjaxTab.ajax__tab_active.ajax__tab_tab

{

/* Our Additions */background-color:#DDDDDD;

}

.StpAjaxTab.ajax__tab_body

{

font-family:verdana,tahoma,helvetica;

font-size:10pt;

border:1pxsolid#999999;

border-top:0;

padding:8px;

background-color:#ffffff;

/* Our Additions */

background-color:#DDDDDD;

border:solid1px#000000;border-top:none0px;

}

I am using the TabContainer with the CssClass like this

<asp:UpdatePanelID="UpdatePanel1"runat="server">

<ContentTemplate>

<ajax:TabContainerID="TabContainer"runat="server"Width="750px"Height="200px"meta:resourcekey="TabContainer"CssClass="StpAjaxTab">

<ajax:TabPanelID="AlleTrefferTabPanel"runat="server">

<HeaderTemplate>

<asp:UpdateProgressID="UpdateProgress"runat="server">

<ProgressTemplate>

<asp:ImageID="ProgressImage"runat="server"ImageUrl="~/Images/progressIcon.gif"Width="16"Height="16"/>

</ProgressTemplate>

</asp:UpdateProgress>

<asp:LabelID="AlleTrefferLabel"runat="server"Visible="false"Text="Alle Treffer"meta:resourcekey="AlleTrefferLabel"></asp:Label>

</HeaderTemplate>

<ContentTemplate>

Content, you may place a button to generate a partial postback...

</ContentTemplate>

</ajax:TabPanel>

</ajax:TabContainer>

 

</ContentTemplate>

</asp:UpdatePanel>
If you try this out, you will see, that it will see that it works perfectly on IE. But on firefox, when a partial postback is generated, the tab headers' positions are not as they have to be.
After a partial postback has been generated, the tabs are not moving back to their original position. So the question is simple. How can I get the TabContainer in firefox behave exact like in IE?
I tried to change the css styles, but it doesn't worked.
Thanks for help,
bye...

Seehttp://blogs.visoftinc.com/archive/2007/09/26/ajax-control-toolkit-tab-control-themes.aspx for a tab theming example.

-Damien

Tab container bug

Hi,

while changing the backcolor of tabcontainer, this one (the tabcontainer) has blast all the page code away:

Line 16: "TabPanel1" runat="server">Line 17: "server">Companii"281479271677955" href="" onclick="return;">Line 18: "server">Line 19: "server" ID="UpdatePanel1" __designer:dtid="281479271677957">"281479271677958">

I checked twice this error and happens only after adding tab panels.

Is a tab container or is something wrong with my application? Or is because of the update panel situated inside of a tab panel ?

Getting the same issue when changing the properties of the tabcontainer in a design mode...


Same problem here!!!!

Everytime I set the width of the TabContainer in design view, every<ContentTemplate>gets replaced with <system.web.ui.control>IndifferentIndifferentIndifferentIndifferentIndifferent

tab container and tab panels

I'm getting what I think is odd behavior from the tab panels. Everything of course works fine if the tab panels are static. However, I want to programmatically add to the tab container in my code behind.

The first time the page loads the outline of the tab container is present (which is fine). I click a button and do a postback for the update panel and two tabpanels are added to the tabcontainer. If I do another postback, then I get an error "There is no source code available for the current location." message box. I click OK. I then get a message box that says, "ArgumentOutOfRangeException was unhandled by user code ....Specified argument was out of range of valid values...Parameter name: index".

For example,

"UpdatePanel1" runat="server" UpdateMode="Conditional"> "TabContainer1" runat="server"> "HiddenField1" runat="server" OnValueChanged="HandleNodeClick"/>public void HandleNodeClick(Object sender, EventArgs e){ AjaxControlToolkit.TabPanel panel1 =new AjaxControlToolkit.TabPanel(); panel1.HeaderText ="panel1"; panel1.Visible =true; panel1.ID ="panel1"; AjaxControlToolkit.TabPanel panel2=new AjaxControlToolkit.TabPanel(); panel2.HeaderText ="panel2"; panel2.Visible =true; panel2.ID ="panel2"; TabContainer1.Controls.Add(panel1); TabContainer1.Controls.Add(panel2);}
As a workaround I tried the following, which didn't work either. I have three different formats of tabcontainers I want to use. I tried just putting the three different tabcontainers on the aspx page to begin with. In the code behind, on page load I set .visible=false for all 3 (which worked as expected). Based on an event, I then set .visible=true for a given tabcontainer. However, only the text of the desired tabcontainer is displayed -- the formatting, the panels, etc. aren't. Suggestions for either of these approaches is much appreciated.

In my case I have successfully created the tabs and the buttons on them - they display just fine and the tabs select. However, as soon as I click on any of the buttons the same error arises. Setting an eventhandler for each button does not cure the problem.

I am very keen for a quick solution!


Further investigation shows that the problem does not even relate to adding controls to the tab but arising even if adding tabs dynamically.

I added a button outside the tab and then just did the tab adding.:

Dim FC()As cCategory = cCategory.AllCats
Dim iAsInteger
For i = 0 To FC.length-1
Dim tab As New AjaxControlToolkit.TabPanel
tab.HeaderText = FC(i).TabName
tab.ID = "tab" & CStr(i)
tbForms.Tabs.Add(tab)
NexttbForms.ActiveTabIndex = 0

A click on the static button then produces the error message.

It seems as if the wiring up of the postback info is incomplete with the dynamically created tabs.


OK guys - I found most of the answer from another thread - use Page_Init

However . . .

ProtectedSub Page_Init(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.InitDim FC()As cCategory = cCategory.AllCats
Dim iAsInteger
For i = 0To 0
Dim tabAsNew AjaxControlToolkit.TabPanel
tab.HeaderText = FC(i).TabName
tab.ID ="tab" &CStr(i)
Dim FM()As cForm = cForm.Tab(FC(i).TabId)
Dim FMname(FM.Length - 1)AsString
Dim jAsInteger
For j = 0To 0
Dim btnAsNew Button
btn.Text = FM(j).Description
btn.ID ="btn" &CStr(i) &":" &CStr(j)
AddHandler btn.Click,AddressOf ButtonClick
tab.Controls.Add(btn)
FMname(j) = FM(j).Description
Next
tbForms.Tabs.Add(tab)
Next
EndSub

PublicSub ButtonClick(ByVal senderAsObject,ByVal eAs System.EventArgs)
EndSub

This fires a postback OK but this never reaches the ButtonClick routine.

Why?


Making progress very slowly!

The Page_Init is performed every time a postback occurs (Before Page_Load) and at that time the dynamically added control do not exist (they have to be re-created each time around, it seems) If I test for postback at the start of Page_Init and do not do the dynamic creation at that time, then the same error as before occurs.

I do not fully understand what is going on but I guess that the postback cannot connect up with the event handling which was created the first time around. Presumably I need to find some way of working out what the postback actually is and look at it explicitly.

Any ideas, folks?


I think I'm hitting the same issue.

I've added two tab panels to my TabContainer statically. The tab panels host the ReportViewer control which is possibly a bit ambitious but it is a business requirement if possible.

Then in the Page_Load event handler I add a third tab panel dynamically with the following code block :

ReportViewer rv = new ReportViewer();
rv.ID = "rv3";
rv.ProcessingMode = ProcessingMode.Remote;
rv.Height = 500;
rv.Width = 950;
rv.Reset();
SetReportParameters(rv, 53); // this just inits the reportviewer

AjaxControlToolkit.TabPanel tabPanel = new AjaxControlToolkit.TabPanel();
tabPanel.ID = "tab3";
tabPanel.HeaderText = "Dynamically added tab panel";
tabPanel.Controls.Add(new LiteralControl("<ContentTemplate>"));
tabPanel.Controls.Add(rv);
tabPanel.Controls.Add(new LiteralControl("</ContentTemplate>"));
//this.tabReports.Controls.Add(tabPanel);
this.tabReports.Controls.AddAt(tabReports.Controls.Count, tabPanel);

This all works fine but it's not really dynamic yet. So I then add a button to the page outside of the TabContainer and in the event handler for it I use a similar code block to the above except I use a different TabPanel.ID. This is when I run into the problem. Before the button event handler code is entered I'm getting the ArgumentOutOfRangeException and VS dumps me into the TabPanelCollection.cs class in the TabPanel method.

public new TabPanel this[int index]
{
get { return (TabPanel)base[index]; }
}

In my case index=2 and the Exception tells me the it is out of range of valid values. What is confusing me is that my code to insert the new panel hasn't been run yet so something else must be going on. In order to speed up diagnostics on this I'm going to remove the ReportViewers and put in some simple controls but in the meantime it would be good if someone from the AJAX team could comment on this issue.

I've now got wroking code - but at the price of a fudge!

Firstly, the dynamic creation must be done in Page_Init (not Page_Load) and must be done on every Postback, not just frst time through.

Secondly, in Page_Load on Postback, I check the Page.Request.Form collection. Despite all that I have read, there is nothing in the first few entries but (4) there is the full name of the control and its text value.

Dim sAsString = Page.Request.Form.AllKeys(4)
If s.ToLower.StartsWith("tbforms")Then
Dim s1()AsString = s.Split("$")
Dim s2AsString = s1(1).Substring(3)
Dim s3AsString = s1(2).Substring(3)
Dim tabNoAsInteger =CInt(s2)
Dim btnNoAsInteger =CInt(s3)

I am far from happy with this as it depends on an undpecified magic number (which, as we all know, chnages just when you can least afford it!)

I still suspect that there is a bug lurking somewhere here.

Tab Container and IE Scrollbars

I am looking for any guidance in resolving an issue that I have run into with the Tab Container. The page that is using this container cannot be navigated using the Browser Scrollbar by clicking on the bar and dragging or using the arrows. Navigation can be done by using the wheel on the mouse or by double clicking on a position on the scroll bar.

Any help is greatly appreciated.

Regards,

Mike

Hi Mrheihardt,

mrheinhardt:

The page that is using this container cannot be navigated using the Browser Scrollbar by clicking on the bar and dragging or using the arrows.

We cannot reproduce your issue. Here is my test sample and it works pretty well on IE 7 and Firefox 2.0.

<%@. Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<ajaxToolkit:TabContainer ID="TabContainer1" runat="server">
<ajaxToolkit:TabPanel ID="TabPanel1" runat="server">
<HeaderTemplate>
Tab1</HeaderTemplate>
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" Height="900" Width="100%">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</asp:Panel>
</ContentTemplate>
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="TabPanel2" runat="server" >
<HeaderTemplate>
Tab2</HeaderTemplate>
<ContentTemplate>
<asp:Panel ID="Panel2" runat="server" Height="200" Width="100%" style="overflow:auto">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</asp:Panel>
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>

</form>
</body>
</html>

Please compare my sample with yours. I use Ajax ControlToolkit V10618. If your version is lower, would you please upgrate it? In this sample ,I use a Panel to shown the content. If it doesn't work on your machine, please provide your sample and system environments here.

I hope this help.

Best regards,

Jonathan


I also face this problem under IE6. But it works fine under IE7.

Tab Container and GridView

Hello

Does any peopel try to use the GridView Paging with the Tab Container? It is because when I try to click to page 2.

Following problem occurred.

Specified argument was out of the range of valid values.
Parameter name: The StartRowIndex '10' is out of range. Current item count is '0'

Hi Hnchan,

Here is the sample which you can reference to. Please compare it with yours.

<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"></script><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:Panel ID="Panel2" runat="server"> <ajaxToolkit:TabContainer ID="TabContainer1" runat="server"> <ajaxToolkit:TabPanel ID="TabPanel1" runat="server"> <HeaderTemplate> Tab1</HeaderTemplate> <ContentTemplate> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EmployeeID" DataSourceID="SqlDataSource1" AllowPaging="true" PageSize="3"> <Columns> <asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False" ReadOnly="True" SortExpression="EmployeeID" /> <asp:BoundField DataField="LastName" HeaderText="LastName" SortExpression="LastName" /> <asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" /> <asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" /> <asp:CommandField ShowEditButton="True" /> </Columns> </asp:GridView> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NORTHWNDConnectionString%>" SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title] FROM [Employees]"></asp:SqlDataSource> </ContentTemplate> </ajaxToolkit:TabPanel> <ajaxToolkit:TabPanel ID="TabPanel2" runat="server"> <HeaderTemplate> Tab2 </HeaderTemplate> <ContentTemplate> <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> </ContentTemplate> </ajaxToolkit:TabPanel> </ajaxToolkit:TabContainer> </asp:Panel> </form></body></html>
Also you can add an UpdatePanel and put the GridView inside the UpdatePanel .Thanks.
Best regards,
Jonathan

I am sorry to say that it still does not work. Is this the problem related the ObjectContainerDataSource from WCSF?


Hi Hnchan,

So what's your Ajax Control Toolkit's version? Mine is V10618.

hnchan:

Is this the problem related the ObjectContainerDataSource from WCSF?

It's hard to say.Would you please wholly copy my source code and have a test.If all these don't work, we really need more information to find out the exact root cause.

I hope this help.

Best regards,

Jonathan

TAB CONTAINER AJAX TOOLKIT

Good Day!!!I'm trying to used Tab Container (Ajax Toolkit) but i need more than 20 tab panels in 1 tab container. The problem is the tab panels I added in the tab container is not fixed to the tab container. Can you help me to fix my problem thank you...marc

Hi

The problem is the tab panels I added in the tab container is not fixed to the tab container?What do you mean?

Please refer to http://ajax.asp.net/ajaxtoolkit/Tabs/Tabs.aspx for help.

Tabs Description

TabContainer is an ASP.NET AJAX Control which creates a set of Tabs that can be used to organize page content. A TabContainer is a host for a number of TabPanel controls.

Each TabPanel defines its HeaderText or HeaderTemplate as well as a ContentTemplate that defines its content. The most recent tab should remain selected after a postback, and the Enabled state of tabs should remain after a postback as well.

Thanks


hi Good Day! I have a tab container with 16 tab panels, and I set the width style of the tab container (770px) , the problem is the other tab panelsis not fixed to the 770px(width of the tab container) and continuesly going to the right. Hope you can help me to my problem thank you.

Tab container & Tab panel

Hi

I am trying to customize look n feel of tab panel's Header Text -- by giving a hover effect or a different background image to tabs. I could not see any way of achieving it.

Where is the location of class ajax__tab_xp? If I create my own class, the separate tabs disappear.. How to apply or modify the stylesheet class??

Thanks in advance for your help.

Anyone guyz? AJAX experts? Please help.

I will greatly appreciate a line of working code for this.. Thanks in advance.


Hi,

Here is a code snippet demonstrate using custom style on tabContainer.


<style type="text/css">
.ajax__tab_xp2 .ajax__tab_header {
font-family:verdana,tahoma,helvetica;
font-size:21px;
background:
repeat-x
bottom;white-space:normal;
}
.ajax__tab_xp2 .ajax__tab_outer {
border-style: solid double;
padding-right:4px;
background:
no-repeat
right;
height:21px;
}
.ajax__tab_xp2 .ajax__tab_inner {
padding-left:3px;
background:
no-repeat;
}
.ajax__tab_xp2 .ajax__tab_tab {
height: 100px;
padding:4px;
margin:0;
background:
repeat-x;
}
.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_outer {
background:
no-repeat
right;
}
.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_inner {
background:
no-repeat;
}
.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_tab {
background:
repeat-x;
}
.ajax__tab_xp2 .ajax__tab_active .ajax__tab_outer {
background:
no-repeat
right;
}
.ajax__tab_xp2 .ajax__tab_active .ajax__tab_inner {
background:
no-repeat;
}
.ajax__tab_xp2 .ajax__tab_active .ajax__tab_tab {
background:
repeat-x;
}
.ajax__tab_xp2 .ajax__tab_container .ajax__tab_default {text-align:center; background-color:Blue;white-space:normal;}
.ajax__tab_xp2 .ajax__tab_body {text-align:center; background-color:Blue; font-family:verdana,tahoma,helvetica;font-size:10pt;border:1px solid #999999;border-top:0;padding:8px; border-style:none; border-color:Green; border-bottom-style:none; border-left:none; border-right:none; border-top:none; }
.ajax__tab_xp .ajax__tab_body {
font-family:verdana,tahoma,helvetica;
font-size:10pt;
border:1px solid #999999;
border-top:0;
padding:8px;
background-color:#ffffff;
}
</style>

<ajaxToolkit:TabContainer CssClass="ajax__tab_xp2" ....................


This question is being asked soooo many times...

Maybe this'll help:

http://forums.asp.net/t/1163303.aspx

And maybe someone should put this in the FAQ (if it isn't already there)..


Thank you Raymond.. your post has solved my problem 95%.. great!

Quick question, on Hover I have:

.ajax__tab_xp2 .ajax__tab_hover .ajax__tab_inner {
/* background:no-repeat; */
font-weight:bold;

due to this, all tabs move or drift little bit (due to font weight change) on Mouse Over.
How can I avoid this?

Thanks & I mark this as answer!Yes


Thank you NNM, for the post link. I totally agree with other member -- TabPanel/Container controls are so "non-intuitive" .. if changing style on tab control must be done through css then why can't MSFT write a single line or provide a sample in their AJAX demos!! I spent freaking hours in figuring this out ...

Believe it .. I am gonna have questions when I start actual coding with Tab Controls! ..Hmm

Sam


sdekha76 :

Try changing thepadding value. There's no fixed answer to padding value, since I think it depends on the font size.

edit: the tab styling may seem non intuitive at first, but once you play around with it a bit, you'll be able to customize it completely, even changing the background images. I really love this toolkit control.

Tab Container Issue - Inside of Update Panel

I was attempting to have a tab container hidden (visible = false) when I load the page inside of an Update Panel. After entering in some search criteria and pressing load, the tab container would become visible, or so I thought. What I got was all of the tabs' header text just written out on one line with the first tab visible and no container. Has anyone ran into this or know a work around? Outside of that, I think this would qualify as a bug or need to be noted in the documentation that you cannot change the visibility of a Tab Container inseide of an Update Panel and expect it to work correctly.

PS. Toggling the visibility of the Tab Containers works fine when the Tab Container is outside of an Update Panel.

Hi,

I fail to reproduce the issue. Can you show me your code?

Tab Container Height

This is more of a display question than anything, but I wasn't sure where else to ask, so here goes :)

I've got 2 table cells right next to each other. One of them is much taller than the one that has my tab container in it. Is there a way I can programatically set the height of the tab control so that it's forced to be as tall as the other table cell? Or heck, if it could just fill up the cell it's in, that'd be fine.

Any help is appreciated, much thanks!

-- Dan

Use the height attribute.


rpack79:

Use the height attribute.


How can I apply the height attribute dynamically based on the size of the cell next to it? I can't assign a height in pixels to it, everything is sized to scale.


Post your code and I'll show you.


How about using % instead of px.

Tab Container Header tabs NOT on multiple rows

This is driving me crazy. I have a webpage that has a table on it. Inside the table I have a TabContainer. I have 13 tab headers I need for the one TabContainer. I populate the tab headers by a call to the database then doing a For Loop to enter all the headers. The problem is that when I run the app the tab headers are all on one row. How do I get the Tab Headers to split up into two rows?

Thanks in advanced.

mutlyp

Hi mutlyp,

As far as I know, there is no build-in support for this feature currently. You can votehere.


Hi Raymond

I actually found the answer but it took a lot of digging on the net. It's from Nazar Rizvi's blog

http://www.narizvi.com/blog/post/Two-rows-of-tab-headers-in-TabContainer-in-Ajax-Control-Toolkit.aspx

You have to go into the Tab.css and change the ".ajax__tab_default.ajax__tab_header {}" line. Then the Tab headers will wrap.

Funny how Nazar knew this and you a Microsoft rep didn't. Maybe you guys should hire Nazar.


Mutlyp,

Thanks for that link...

Regards

Karen


Thanks for sharing, it's so helpful.

Tab Container Error after a Refresh

I have a tab container with two tab panels inside of it, and they work perfectly well the first time the page is loaded. If I hit refresh (not post back I am talking F5 or the browser refresh button) the page loads up except for the tab container which does not show up.

The error I receive in IE is the following

Line: 6
Char 31345
Error: Object Expected

When I run this in Firefox and check the error in FireBug It tells me the following error occurred

h is not a constructor

createCallback(undefined,Object,null,Object,div#ctl00_mainContent1_ComparisonPieCharts1_TabContainer1_PublisherTab)ScriptResource.ax... (line 5)

(no name)()default.aspx (line 988)

createCallback(Object _disposableObjects=[2] _components=Object,Object)ScriptResource.ax... (line 5)

createCallback()ScriptResource.ax... (line 5)

createCallback()ScriptResource.ax... (line 5)

Function.__typeName="Function";Function.__class=true;Function.createCallback=fun...

Thanks in advance for your help,

Brendan

I set my ScriptMode for my scriptmanager to Debug and now I found that the error message is really

Sys.ArgumentUndefinedException: Value cannot be undefined.Parameter name: type

Sys$CultureInfo$_getAbbrMonthIndex("")ScriptResource.ax... (line 5762)

{name: "element", mayBeNull: true, domElement: true, optional: true}


Hi Brendan,

Can you post a simple repro of your issue?

Tab Container doubts

Hi,

I have two questions regarding the Tab Container Control:

1) How can I get the current Tab in the code behind ?

2) if I have five tabpanels, with one grid view on each one and I want to use the updatepanel.

should I create one updatepanel and place all the tabpanels on it, or create one updatepanel for each tabpanel ?

Thanks !

I haven't tried your Tab / Update Panel combinations, but getting the current TabIndex in your server code is easy.

Dim TabNoAsInteger

TabNo = TabContainer1.ActiveTabIndex

Remember Active.TabIndex is Zero based so if you have 4 tabes and the last one is selected, the active index will be "3"


Hi,

Personally, I'd place different UpdatePanel for each tab. Haven't done this ever too, you may have a try and know if it works.


The Tab / Update panel combination worked smothly by using a diferent updatepanel for each tabpanel, like Raymond suggested.

If you want, you can use an update progress like this:

<asp:UpdateProgressID="UpdateProgress1"runat="server"AssociatedUpdatePanelID="Tabs$Panel1$upd1">

Thanks Joe and Raymond,

Skynyrd

Tab container disappears when client script added

If I write this:

<cc1:TabContainerEnableViewState="true"runat="server"ID="TabContainer1"Width="100%"

Height="490px"ScrollBars="Auto"ActiveTabIndex="1">

everything works fine. I'd like to detect client side which tab was clicked. If I write ...

<cc1:TabContainerEnableViewState="true"runat="server"OnClientActiveTabChanged="hello()"ID="TabContainer1"Width="100%"

Height="490px"ScrollBars="Auto"ActiveTabIndex="1">

... the tab container is not displayed when the page is viewed in a browser. The function being called - hello() - is just a simple

function hello()

{

alert('hello');

}

If I add 'onClientClick' to the tab itself - same thing happens. Tab container is not displayed.

<cc1:TabPanelID="tbContact"runat="server"onClientClick="hello()"HeaderText="Contact Summary">

Any idea what is wrong? From what I have read it should work.

Thanks for any help.

Hi,

Based on my test, it worked fine.

I suspect there is something else that break it. Can you provide a simple repro of the issue?

Tab Content Disappears by Clicking on Active Tab

I am puzzled as to why the dynamically loaded content of an Active Tab disappears when I click on the Active Tab. But if I click on another Tab and go back to the previous tab the content appears.

<%@dotnet.itags.org.PageLanguage="C#"MasterPageFile="~/MasterPages/DeafaultMasterPage.master"AutoEventWireup="true"CodeFile="Default.aspx.cs"Inherits="_Default"Title="Default Page" %>
<asp:ContentID="Content2"ContentPlaceHolderID="cphBody"Runat="Server">
<scripttype="text/javascript"language="javascript">
function ActiveTabChanged(sender, e)
{
__doPostBack('<%= tcDefault.ClientID %>', sender.get_activeTab().get_headerText());
}
</script>
<ajaxToolkit:TabContainerID="tcDefault"runat="server"OnClientActiveTabChanged="ActiveTabChanged"

OnActiveTabChanged="ActiveTabChangedServer">

<ajaxToolkit:TabPanelID="tab1"runat="server"HeaderText="Info"EnableViewState="true">

<ContentTemplate>Dynamic content, load UserControl

</ContentTemplate>

</ajaxToolkit:TabPanel>

<ajaxToolkit:TabPanelID="tab2"runat="server"HeaderText="tab 2"EnableViewState="true"/></ajaxToolkit:TabContainer>

Code Behind

protected void Page_Load(object sender, EventArgs e) { ScriptManager sm = ScriptManager.GetCurrent(this.Page); sm.RegisterAsyncPostBackControl(tcDefault); }  
protected void ActiveTabChangedServer(object sender, EventArgs e) {// Initialize Tab TabContainer tc = (TabContainer)CommonUtility.FindControlRecursive(this,"tcDefault");if (tcDefault.ActiveTab == tab1) { LoadControl1(tc); }if (tcDefault.ActiveTab == tab2) {//Do something in code LoadControl2(tc); } }

I noticed if I did the following;

protected void Page_Load(object sender, EventArgs e) { ReCreateTab(); }

The content in the tab sticks, but then the content is displayed twice. I know it has something to do with the ViewState, but not sure how to debug and what to read, I am new at this .Net and Ajax.

Any help would be appreciate.


Hi,

This is a FAQ regarding dynamic controls in asp.net. Please refer to this:

1. Why do I have to recreate dynamic controls every time? /Why dynamic controls are disappeared on PostBack?

Whenever a request comes, a new instance of the page that isbeing requested is created to serve the request even it's a PostBack. Allcontrols on the page are reinitialized, and there state can be restored fromthe ViewState in a later phase.

The dynamic controls have to be recreated again and added tothe control hierarchy. Otherwise, they won't exist in the page.

Please be careful with when to create dynamic controls. Inorder to keep their state, they have to be created before the LoadViewStatephase. Page_Init as well as Page_Load methods are options available.

For more information about this topic, please refer to thisarticle:

Creating Dynamic Data Entry User Interfaces[http://msdn2.microsoft.com/en-us/library/aa479330.aspx ]

Hope this helps.

tab container: tab panel appears but not the controls in it

Hello,

I have a ajax tab container with 4 tab panels. each panel has arround 30 to 40 controls.later I added another(5th) panel with text box control. The new panel appears, but the control in it is not displayed.

When I tested again with a new file,new tab container, with 7 to 8 panels with no controls. I just added 1 single control to 8 th panel. This time it displays properly.

I am unable to figure out whether it is problem with tab container control, because it has too many controls? I am using ajax control toolkit version 1.0.10301.0.

(or)

problem with the html content I wrote.Here is my code.Pls help.Its urgent

<divid="divMain"style="overflow: auto">

<cc1:TabContainerID="TabContainer1"runat="server"Visible="true"ActiveTabIndex="2">

<cc1:TabPanelID="tpCallHandling"runat="server">

<HeaderTemplate>

Call Handling</HeaderTemplate>

<ContentTemplate>

<tablewidth="98%"style="height: 98%">

<tr>

<tdalign="center"colspan="5"class="aimTableH">

<asp:Labelrunat="server"ID="Label29"CssClass="aimth2"><b> Call Handling</b></asp:Label></td>

</tr>

<trclass="aimTableH"align="center">

<td>

<asp:Labelrunat="server"ID="lblEscalate"CssClass="aimth2"><b>Escalate</b></asp:Label>

</td>

<td>

<asp:Labelrunat="server"ID="Label1"CssClass="aimth2"><b>Lead Type</b></asp:Label>

</td>

<td>

<asp:Labelrunat="server"ID="Label2"CssClass="aimth2"><b>Maximum Attempts</b></asp:Label>

</td>

<td>

<asp:Labelrunat="server"ID="Label3"CssClass="aimth2"><b>Word Tracks</b></asp:Label>

</td>

<td>

<asp:LabelID="lblEmailRecipients"runat="server"CssClass="aimth2"><b>Email Recipients</b></asp:Label>

</td>

</tr>

</table>

</ContentTemplate>

</cc1:TabPanel>

.

.

.

.

.

.

.

<cc1:TabPanelrunat="server"ID="TabPanel2">

<HeaderTemplate>TESTING</HeaderTemplate>

<ContentTemplate>

<tablewidth="98%"height="100%">

<tr>

<td>

<asp:TextBoxrunat="server"ID="txt1"></asp:TextBox>

</td>

</tr>

</table>

</ContentTemplate>

</cc1:TabPanel>

</cc1:TabContainer>

</div>

<tablewidth="98%"height="100%">

In bold, that is an error... Style="height:98%" is an error too...

My guess is maybe your controls are hidden by the table...

Another tip: if you have too many controls in each tab, maybe try seperating the contents into iframes... Easier to debug..

Tab Container/Panel with Master Page

I have a VB.Net/Asp.Net 2005 application and I would like to use a Master Page with a tab control

Inside the master page I have a tab control with five Tab Panels and I would like to put a ContentPlaceholder inside each tab's ContentTemplate but I am not allowed to do that. Does anyone have any good samples using Tab Containers/Panels inside a master page like this?

thanks

Hi,

As you've discovered, it can't be used this way unless you change the access modifier of TabPanelContainer to public and rebuild it.

Tab Container within an Update Panel

I am working on a page that contains a grid within an update panel. The user selects an item from the grid, popping up a draggable panel with the details of the item they selected.

I want to be able to have a tab control within the pop up, but am running into some issues. The backgrounds of the tab headers dont show up. It looks to me like the styles arent getting sent to the browser because the control is being added to the page through the update panel. When I move the tab control outside of the update panel, or add another one to the page that is visible on page load it looks fine.

I was about to add another tab container to the page and set the display to none but that seems like a hack. I was wondering if there is any other way to get the styles for the tab container down to the page on load without having to do something like that.

Thanks for the help in advance,
James Hollister
Ascending Integration Inc.
www.AscendingIntegration.com

The tab control should be outside that UpdatePanel or inside a new UpdatePanel to work. Makes sense?

If you, please post the code and let's figure it out.


I'm having the same issue with the TabContainer styles not being sent to the browser, did anyone find a solution for this?

The tab container itself contains ajax functionality

Most Controls that contain built in ajax functionality dont work well in an UpdatePanel because the javascript does not gets send in an update panel during partial updates

You will need to keep the tab container outside of an update panel.

This however causes the problem of the tab container state not being updated from the code behind. For example i was not able to change the active tab from code behind in a partial postback.

The turnaround for this was that i used javascript

the below code shows how exactly

first io create a javascript function to change the active tab index

function ChangeTab(indx)

{

$find('<%=TabContainer1.ClientID%>').set_activeTabIndex(indx)

}

$find('<%=TabContainer1.ClientID%>') gets a reference to the tab container object in the javascript

then called this from code behind using the following

ScriptManager.RegisterStartupScript(Me, updButtonBar.GetType,"KEY","ChangeTab(2);",True)

here the me is the page and updbuttonbar is the update panel . It can be any update panel in the page.

In this way you can manipulate the tab container by calling any of the methods of the tab container javascript object.

If you want to find the listing of the methods save As the page containing the tab container as a complete web page on ur local hard drive

in one of the resources file u can find the methods the javascript object tab container contains or perhaps download the ajax control toolkit source

This ways was good enough for me.

Let me know if it helps

Cheers

Sohail Sayed


No this is not true - UpdatePanel does incremental loading of the scripts.

I'm not able to repro this. On the sample page, I wrap the TabContainer in an UpdatePanel and it works fine.

Can someone please post a repro?


I would do, but the situation in which this problem has arisen for me is a little bit complicated, since i'm building a custom webpart based draggy droppy affair. The TabContainer is in an UpdatePanel, which is in another UpdatePanel, and i'm creating it programatically.

I'll have a quick play, and see if i can get it to happen in a simpler scenario.


Ok, this is a much simplified reproduction of my page, but it causes the "bug". I need to add a TabContainer dynamically as the result of a button press, and in the following conditions, it appears with no styles on it.

<html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <div><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> </div><asp:UpdatePanel ID="UpdatePanel1" runat="server"><ContentTemplate><asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"><ContentTemplate><asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" /></ContentTemplate></asp:UpdatePanel></ContentTemplate></asp:UpdatePanel> </form></body></html>
 
 
protected void Page_Load(object sender, EventArgs e) { }protected void Button1_Click(object sender, EventArgs e) { AjaxControlToolkit.TabContainer tbc =new AjaxControlToolkit.TabContainer(); AjaxControlToolkit.TabPanel tbp1 =new AjaxControlToolkit.TabPanel(); tbp1.HeaderText ="Test Panel 1"; Literal ltrl1 =new Literal(); ltrl1.Text ="Panel 1 Content"; tbp1.Controls.Add(ltrl1); tbc.Tabs.Add(tbp1); AjaxControlToolkit.TabPanel tbp2 =new AjaxControlToolkit.TabPanel(); tbp2.HeaderText ="Test Panel 2"; Literal ltrl2 =new Literal(); ltrl2.Text ="Panel 2 Content"; tbp2.Controls.Add(ltrl2); tbc.Tabs.Add(tbp2); UpdatePanel2.ContentTemplateContainer.Controls.Add(tbc); }

The problem that I am having along these lines is that when either the TabContainer itself or whatever container it is in (ex. Panel) is set to Visible=false; then on the partial page load the styling is not loaded. From my understanding it adds a <link> to the header when the page is loaded but this doesn't work if the control was not visible when the page was initially rendered. When the TabContainer is rendered everything is there and it works but you can't see the tab but only the HeaderText. All of the styling is lost.

Any idea of how to get around this? My thought was to add the <link> when the page is first loaded but I'm can't find anything about how to do this.

Luke


I'm having the same problem.

If I create a TabContainer dynamically (through OnInit) or initially set the TabContainer.Visible = false, the styling does not load.


Hi,

Unfortunatelly TabContainer does not properly load CSS if it first appears on the page in UpdatePanel with async update postback. However, it is quite easy to solve this, by adding an empty TabContainer somewhere to the page, but utside any UpdatePanel. Empty TabContainer without any Tabs does not render anything noticable to the page, but it loads CSS which is later used by other TabContainers.

So, add a TabContainer without pages to your page and make sure it is not in UpdatePanel and it its Visible = true.

-yuriy
http://couldbedone.blogspot.com


That did the trick. I added the following code and it works just like I want it to.

</asp:UpdatePanel>
<ajaxToolkit:TabContainerID="tabNotUsed"runat="server"Visible="true"/>

Thanks for the help!

Luke

Tab container width

Can the container width be set somehow to dynamically adjust based on it's content?

I have a 3 tabbed container with a Gridview within one of them. The edit mode of the Gridview is wider than when it is in Read mode. So lets say the default with of the container would be set to 600px, but when the Gridview goes into edit mode it might be 800px. The Gridview in edit mode will go right over the 'border' of the container in this case. Can this be configured to work change the width dynamically based on it's content, or do I have to figure out the widest instance and set it to that or programatically change the width on the container when the Gridview goes to edit mode?

Thanks

Mark,

could you post some of your HTML/ASP.NET declaration for the Tab and Content? The Tab is resizing quite well here...

Alexander

Tab container styles

Can we change tab containers look and feel by overriding its CSS ,

Yes of course :)

Look in the Tabs.css file in the folder where you've installed the AjaxControlToolkit.

These CSS classes can you override in your own CSS file (new is the name of the style I choose, then you specify the attribute CssClass="ajax__tab_new" to override the CSS style):

/* inactive tab */
.ajax__tab_new .ajax__tab_header
.ajax__tab_new .ajax__tab_outer
.ajax__tab_new .ajax__tab_inner
.ajax__tab_new .ajax__tab_tab
/* active tab */
.ajax__tab_new .ajax__tab_active .ajax__tab_outer
.ajax__tab_new .ajax__tab_active .ajax__tab_inner
.ajax__tab_new .ajax__tab_active .ajax__tab_tab
/* tab hover */
.ajax__tab_new .ajax__tab_hover .ajax__tab_outer
.ajax__tab_new .ajax__tab_hover .ajax__tab_inner
.ajax__tab_new .ajax__tab_hover .ajax__tab_tab
/* tab's body */
.ajax__tab_new .ajax__tab_body

Kind regards,

sbogus.


I tried that and I still get the default tabs everytime.

Here is my stylesheet:

.MyTabStyle .ajax__tab_header{font-family:verdana,tahoma,helvetica;font-size:3px;background:url(../images/tab-line.gif) repeat-x bottom;}
.MyTabStyle .ajax__tab_outer{padding-right:4px;background:url(../images/tab-active-right.gif) no-repeat right;height:21px;}
.MyTabStyle .ajax__tab_inner{padding-right:3px;background:url(../images/tab-active-left.gif) no-repeat;}
.MyTabStyle .ajax__tab_tab{height:13px;padding:4px;margin:0;background:url(../images/tab-active.gif) repeat-x;}

.MyTabStyle .ajax__tab_hover .ajax__tab_outer{background: url(../images/tab-active-right.gif) no-repeat left top;}
.MyTabStyle .ajax__tab_hover .ajax__tab_inner{background: url(../images/tab-active-left.gif) no-repeat left top;}
.MyTabStyle .ajax__tab_hover .ajax__tab_tab{background: url(../images/tab-active.gif) repeat-x botom;}

.MyTabStyle .ajax__tab_active .ajax__tab_outer{background: url(../images/tab-active-right.gif) no-repeat left top;}
.MyTabStyle .ajax__tab_active .ajax__tab_inner{background: url(../images/tab-active-left.gif) no-repeat left top;}
.MyTabStyle .ajax__tab_active .ajax__tab_tab{background: url(../images/tab-active.gif) repeat-x botom;}

.MyTabStyle .ajax__tab_body {font-family:verdana,tahoma,helvetica;font-size:10pt;border:1px solid #999999;border-top:0;padding:8px;background-color:#ffffff;}

This is pretty much copied from the Tabs.css file just to see if everything worked and I still get the default tabs. What am I missing something? Now the tabs demo says that it can be done this way.


Yes you are right, you are on correct way. I had similar issue with customization and I found that I have issue with my development enviroment.

Issue was that I was running on Windows Vista with VS .NET 2005. If you have the same enviroment don't use debug from VS. Just deploy your application to IIS and try it from there. It worked on my machine.


ricco831:

I tried that and I still get the default tabs everytime.

Have a look at thisblog entry, it discusses "Theming" the tabs

-Damien

Tab container problem

I am having a problem with my tab panel/tab container. Whenever I make a change or click in a tab it refreshes and takes me to the tab called pictures upload/modify. I want to be able to make changes in a tab and stay in that tab not switch tabs. I'm not sure what is causing this any ideas?

Here is the code:

<%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<%@dotnet.itags.org. Page Language="VB" MasterPageFile="~/masterpage.master" Title="Untitled Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString1 %>"
DeleteCommand="DELETE FROM [Scrollbar] WHERE [EventID] = @dotnet.itags.org.EventID" InsertCommand="INSERT INTO [Scrollbar] ([Event]) VALUES (@dotnet.itags.org.Event)"
SelectCommand="SELECT * FROM [Scrollbar]" UpdateCommand="UPDATE [Scrollbar] SET [Event] = @dotnet.itags.org.Event WHERE [EventID] = @dotnet.itags.org.EventID">
<DeleteParameters>
<asp:Parameter Name="EventID" Type="Int32" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="Event" Type="String" />
<asp:Parameter Name="EventID" Type="Int32" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="Event" Type="String" />
</InsertParameters>
</asp:SqlDataSource>
<asp:SqlDataSource ID="SqlDataSource3" runat="server" ConflictDetection="CompareAllValues"
ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString1 %>" DeleteCommand="DELETE FROM [Picture] WHERE [Picture_ID] = @dotnet.itags.org.original_Picture_ID AND [Picture_Name] = @dotnet.itags.org.original_Picture_Name AND [Picture_Description] = @dotnet.itags.org.original_Picture_Description AND [Picture_Date] = @dotnet.itags.org.original_Picture_Date AND [Picture_User] = @dotnet.itags.org.original_Picture_User AND [Picture_Path] = @dotnet.itags.org.original_Picture_Path"
InsertCommand="INSERT INTO [Picture] ([Picture_Name], [Picture_Description], [Picture_Date], [Picture_User], [Picture_Path]) VALUES (@dotnet.itags.org.Picture_Name, @dotnet.itags.org.Picture_Description, @dotnet.itags.org.Picture_Date, @dotnet.itags.org.Picture_User, @dotnet.itags.org.Picture_Path)"
OldValuesParameterFormatString="original_{0}" SelectCommand="SELECT * FROM [Picture]"
UpdateCommand="UPDATE [Picture] SET [Picture_Name] = @dotnet.itags.org.Picture_Name, [Picture_Description] = @dotnet.itags.org.Picture_Description, [Picture_Date] = @dotnet.itags.org.Picture_Date, [Picture_User] = @dotnet.itags.org.Picture_User, [Picture_Path] = @dotnet.itags.org.Picture_Path WHERE [Picture_ID] = @dotnet.itags.org.original_Picture_ID AND [Picture_Name] = @dotnet.itags.org.original_Picture_Name AND [Picture_Description] = @dotnet.itags.org.original_Picture_Description AND [Picture_Date] = @dotnet.itags.org.original_Picture_Date AND [Picture_User] = @dotnet.itags.org.original_Picture_User AND [Picture_Path] = @dotnet.itags.org.original_Picture_Path">
<DeleteParameters>
<asp:Parameter Name="original_Picture_ID" Type="Int32" />
<asp:Parameter Name="original_Picture_Name" Type="String" />
<asp:Parameter Name="original_Picture_Description" Type="String" />
<asp:Parameter Name="original_Picture_Date" Type="DateTime" />
<asp:Parameter Name="original_Picture_User" Type="String" />
<asp:Parameter Name="original_Picture_Path" Type="String" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="Picture_Name" Type="String" />
<asp:Parameter Name="Picture_Description" Type="String" />
<asp:Parameter Name="Picture_Date" Type="DateTime" />
<asp:Parameter Name="Picture_User" Type="String" />
<asp:Parameter Name="Picture_Path" Type="String" />
<asp:Parameter Name="original_Picture_ID" Type="Int32" />
<asp:Parameter Name="original_Picture_Name" Type="String" />
<asp:Parameter Name="original_Picture_Description" Type="String" />
<asp:Parameter Name="original_Picture_Date" Type="DateTime" />
<asp:Parameter Name="original_Picture_User" Type="String" />
<asp:Parameter Name="original_Picture_Path" Type="String" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="Picture_Name" Type="String" />
<asp:Parameter Name="Picture_Description" Type="String" />
<asp:Parameter Name="Picture_Date" Type="DateTime" />
<asp:Parameter Name="Picture_User" Type="String" />
<asp:Parameter Name="Picture_Path" Type="String" />
</InsertParameters>
</asp:SqlDataSource>

<cc1:TabContainer ID="TabContainer1" runat="server" width="875px" style="z-index: 133; left: 20px; position: absolute; top: 300px" BackColor="Transparent">
<cc1:TabPanel ID="TabPanel1" runat="server" HeaderText="Events Data">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EventID"
DataSourceID="SqlDataSource2" EmptyDataText="There are no data records to display.">
<Columns>
<asp:CommandField ShowDeleteButton="True" ShowEditButton="True" />
<asp:BoundField DataField="EventID" HeaderText="EventID" ReadOnly="True" SortExpression="EventID" />
<asp:BoundField DataField="EventName" HeaderText="EventName" SortExpression="EventName" />
<asp:BoundField DataField="EventDate" HeaderText="EventDate" SortExpression="EventDate"/>
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource8" runat="server" ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString5 %>"
DeleteCommand="DELETE FROM [Events] WHERE [EventID] = @dotnet.itags.org.EventID" InsertCommand="INSERT INTO [Events] ([EventName], [EventDate]) VALUES (@dotnet.itags.org.EventName, @dotnet.itags.org.EventDate)"
ProviderName="<%$ ConnectionStrings:CORE2062ConnectionString5.ProviderName %>"
SelectCommand="SELECT [EventID], [EventName], [EventDate] FROM [Events]" UpdateCommand="UPDATE [Events] SET [EventName] = @dotnet.itags.org.EventName, [EventDate] = @dotnet.itags.org.EventDate WHERE [EventID] = @dotnet.itags.org.EventID">
<InsertParameters>
<asp:Parameter Name="EventName" Type="String" />
<asp:Parameter Name="EventDate" Type="String" />
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="EventName" Type="String" />
<asp:Parameter Name="EventDate" Type="String" />
<asp:Parameter Name="EventID" Type="Int32" />
</UpdateParameters>
<DeleteParameters>
<asp:Parameter Name="EventID" Type="Int32" />
</DeleteParameters>
</asp:SqlDataSource>
<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" DataKeyNames="EventID"
DataSourceID="SqlDataSource2" DefaultMode="Insert" Height="50px" Width="125px">
<Fields>
<asp:BoundField DataField="EventID" HeaderText="EventID" InsertVisible="False" ReadOnly="True"
SortExpression="EventID" />
<asp:BoundField DataField="EventName" HeaderText="EventName" SortExpression="EventName" />
<asp:BoundField DataField="EventDate" HeaderText="EventDate" SortExpression="EventDate" />
<asp:CommandField ShowInsertButton="True" />
</Fields>
</asp:DetailsView>
<br />
<asp:SqlDataSource ID="SqlDataSource6" runat="server" ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString4 %>"
DeleteCommand="DELETE FROM [Scrollbar] WHERE [EventID] = @dotnet.itags.org.EventID" InsertCommand="INSERT INTO [Scrollbar] ([Event]) VALUES (@dotnet.itags.org.Event)"
ProviderName="<%$ ConnectionStrings:CORE2062ConnectionString4.ProviderName %>"
SelectCommand="SELECT [EventID], [Event] FROM [Scrollbar]" UpdateCommand="UPDATE [Scrollbar] SET [Event] = @dotnet.itags.org.Event WHERE [EventID] = @dotnet.itags.org.EventID">
<InsertParameters>
<asp:Parameter Name="Event" Type="String" />
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="Event" Type="String" />
<asp:Parameter Name="EventID" Type="Int32" />
</UpdateParameters>
<DeleteParameters>
<asp:Parameter Name="EventID" Type="Int32" />
</DeleteParameters>
</asp:SqlDataSource>
<asp:SqlDataSource ID="SqlDataSource7" runat="server" ConflictDetection="CompareAllValues" ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString4 %>" DeleteCommand="DELETE FROM [Scrollbar] WHERE [EventID] = @dotnet.itags.org.original_EventID AND [Event] = @dotnet.itags.org.original_Event" InsertCommand="INSERT INTO [Scrollbar] ([Event]) VALUES (@dotnet.itags.org.Event)" OldValuesParameterFormatString="original_{0}" SelectCommand="SELECT * FROM [Scrollbar]" UpdateCommand="UPDATE [Scrollbar] SET [Event] = @dotnet.itags.org.Event WHERE [EventID] = @dotnet.itags.org.original_EventID AND [Event] = @dotnet.itags.org.original_Event">
<DeleteParameters>
<asp:Parameter Name="original_EventID" Type="Int32" />
<asp:Parameter Name="original_Event" Type="String" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="Event" Type="String" />
<asp:Parameter Name="original_EventID" Type="Int32" />
<asp:Parameter Name="original_Event" Type="String" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="Event" Type="String" />
</InsertParameters>
</asp:SqlDataSource>
<br />
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" DataKeyNames="EventID"
DataSourceID="SqlDataSource7">
<Columns>
<asp:CommandField ShowDeleteButton="True" ShowEditButton="True" />
<asp:BoundField DataField="EventID" HeaderText="EventID" InsertVisible="False" ReadOnly="True"
SortExpression="EventID" />
<asp:BoundField DataField="Event" HeaderText="Event" SortExpression="Event" />
</Columns>
</asp:GridView>

</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="TabPanel2" runat="server" HeaderText="Users">
<ContentTemplate>
<asp:CreateUserWizard ID="CreateUserWizard1" runat="server">
<WizardSteps>
<asp:CreateUserWizardStep ID="CreateUserWizardStep1" runat="server">
</asp:CreateUserWizardStep>
<asp:CompleteWizardStep ID="CompleteWizardStep1" runat="server">
</asp:CompleteWizardStep>
</WizardSteps>
</asp:CreateUserWizard>
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="TabPanel3" runat="server" HeaderText="Pictures Upload/Modify">
<ContentTemplate>
<asp:FileUpload ID="FileUpload1" runat="server" />
<br /><asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Upload" />
<asp:Label ID="Label1" runat="server" Text="Please browse for a picture and then complete the following form."></asp:Label>
<asp:Label ID="Label2" runat="server" style="z-index: 100; left: 338px; position: absolute; top: 372px"></asp:Label>

<asp:DetailsView ID="DetailsView2" runat="server" AutoGenerateRows="False" DataKeyNames="Picture_ID"
DataSourceID="SqlDataSource3" DefaultMode="Insert" Height="50px" Width="125px">
<Fields>
<asp:BoundField DataField="Picture_ID" HeaderText="ID" InsertVisible="False"
ReadOnly="True" SortExpression="Picture_ID" />
<asp:BoundField DataField="Picture_Name" HeaderText="Name" SortExpression="Picture_Name" />
<asp:BoundField DataField="Picture_Description" HeaderText="Picture Description(optional)"
SortExpression="Picture_Description" />
<asp:BoundField DataField="Picture_Date" HeaderText="Date" SortExpression="Picture_Date(optional)" />
<asp:BoundField DataField="Picture_User" HeaderText="User" SortExpression="Picture_User" />
<asp:BoundField DataField="Picture_Path" HeaderText="Path" SortExpression="Picture_Path" NullDisplayText="FileUpload1.PostedFile.FileName"/>
<asp:CommandField ShowInsertButton="True"/>
</Fields>
</asp:DetailsView>

<asp:GridView ID="GridView3" runat="server" AutoGenerateColumns="False" DataKeyNames="Picture_ID"
DataSourceID="SqlDataSource5" EmptyDataText="There are no data records to display.">
<Columns>
<asp:CommandField ShowDeleteButton="True" ShowEditButton="True" />
<asp:BoundField DataField="Picture_ID" HeaderText="Picture_ID" ReadOnly="True" SortExpression="Picture_ID" />
<asp:BoundField DataField="Picture_Name" HeaderText="Picture_Name" SortExpression="Picture_Name" />
<asp:BoundField DataField="Picture_Description" HeaderText="Picture_Description"
SortExpression="Picture_Description" />
<asp:BoundField DataField="Picture_Date" HeaderText="Picture_Date" SortExpression="Picture_Date" />
<asp:BoundField DataField="Picture_User" HeaderText="Picture_User" SortExpression="Picture_User" />
<asp:BoundField DataField="Picture_Path" HeaderText="Picture_Path" SortExpression="Picture_Path" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource5" runat="server" ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString3 %>"
DeleteCommand="DELETE FROM [Picture] WHERE [Picture_ID] = @dotnet.itags.org.Picture_ID" InsertCommand="INSERT INTO [Picture] ([Picture_Name], [Picture_Description], [Picture_Date], [Picture_User], [Picture_Path]) VALUES (@dotnet.itags.org.Picture_Name, @dotnet.itags.org.Picture_Description, @dotnet.itags.org.Picture_Date, @dotnet.itags.org.Picture_User, @dotnet.itags.org.Picture_Path)"
ProviderName="<%$ ConnectionStrings:CORE2062ConnectionString3.ProviderName %>"
SelectCommand="SELECT [Picture_ID], [Picture_Name], [Picture_Description], [Picture_Date], [Picture_User], [Picture_Path] FROM [Picture]"
UpdateCommand="UPDATE [Picture] SET [Picture_Name] = @dotnet.itags.org.Picture_Name, [Picture_Description] = @dotnet.itags.org.Picture_Description, [Picture_Date] = @dotnet.itags.org.Picture_Date, [Picture_User] = @dotnet.itags.org.Picture_User, [Picture_Path] = @dotnet.itags.org.Picture_Path WHERE [Picture_ID] = @dotnet.itags.org.Picture_ID">
<InsertParameters>
<asp:Parameter Name="Picture_Name" Type="String" />
<asp:Parameter Name="Picture_Description" Type="String" />
<asp:Parameter Name="Picture_Date" Type="DateTime" />
<asp:Parameter Name="Picture_User" Type="String" />
<asp:Parameter Name="Picture_Path" Type="String" />
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="Picture_Name" Type="String" />
<asp:Parameter Name="Picture_Description" Type="String" />
<asp:Parameter Name="Picture_Date" Type="DateTime" />
<asp:Parameter Name="Picture_User" Type="String" />
<asp:Parameter Name="Picture_Path" Type="String" />
<asp:Parameter Name="Picture_ID" Type="Int32" />
</UpdateParameters>
<DeleteParameters>
<asp:Parameter Name="Picture_ID" Type="Int32" />
</DeleteParameters>
</asp:SqlDataSource>
<asp:SqlDataSource ID="SqlDataSource4" runat="server" ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString1 %>"
DeleteCommand="DELETE FROM [Picture] WHERE [Picture_ID] = @dotnet.itags.org.Picture_ID" InsertCommand="INSERT INTO [Picture] ([Picture_Name], [Picture_Description], [Picture_Date], [Picture_User], [Picture_Path]) VALUES (@dotnet.itags.org.Picture_Name, @dotnet.itags.org.Picture_Description, @dotnet.itags.org.Picture_Date, @dotnet.itags.org.Picture_User, @dotnet.itags.org.Picture_Path)"
ProviderName="<%$ ConnectionStrings:CORE2062ConnectionString1.ProviderName %>"
SelectCommand="SELECT [Picture_ID], [Picture_Name], [Picture_Description], [Picture_Date], [Picture_User], [Picture_Path] FROM [Picture]"
UpdateCommand="UPDATE [Picture] SET [Picture_Name] = @dotnet.itags.org.Picture_Name, [Picture_Description] = @dotnet.itags.org.Picture_Description, [Picture_Date] = @dotnet.itags.org.Picture_Date, [Picture_User] = @dotnet.itags.org.Picture_User, [Picture_Path] = @dotnet.itags.org.Picture_Path WHERE [Picture_ID] = @dotnet.itags.org.Picture_ID">
<InsertParameters>
<asp:Parameter Name="Picture_Name" Type="String" />
<asp:Parameter Name="Picture_Description" Type="String" />
<asp:Parameter Name="Picture_Date" Type="DateTime" />
<asp:Parameter Name="Picture_User" Type="String" />
<asp:Parameter Name="Picture_Path" Type="String" />
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="Picture_Name" Type="String" />
<asp:Parameter Name="Picture_Description" Type="String" />
<asp:Parameter Name="Picture_Date" Type="DateTime" />
<asp:Parameter Name="Picture_User" Type="String" />
<asp:Parameter Name="Picture_Path" Type="String" />
<asp:Parameter Name="Picture_ID" Type="Int32" />
</UpdateParameters>
<DeleteParameters>
<asp:Parameter Name="Picture_ID" Type="Int32" />
</DeleteParameters>
</asp:SqlDataSource>
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="TabPanel4" runat="server" HeaderText="Meeting Notes">
<ContentTemplate>

<asp:GridView ID="GridView4" runat="server" AutoGenerateColumns="False" DataKeyNames="Meeting_ID"
DataSourceID="SqlDataSource9" EmptyDataText="There are no data records to display." AllowSorting="True">
<Columns>
<asp:CommandField ShowDeleteButton="True" ShowEditButton="True" />
<asp:BoundField DataField="Meeting_ID" HeaderText="Meeting_ID" ReadOnly="True" SortExpression="Meeting_ID" />
<asp:BoundField DataField="Meeting_Date" HeaderText="Meeting_Date" SortExpression="Meeting_Date" />
<asp:BoundField DataField="Meeting_Title" HeaderText="Meeting_Title" SortExpression="Meeting_Title" />
<asp:BoundField DataField="Meeting_Description" HeaderText="Meeting_Description"
SortExpression="Meeting_Description" />
<asp:BoundField DataField="Meeting_Topic1" HeaderText="Meeting_Topic1" SortExpression="Meeting_Topic1" />
<asp:BoundField DataField="Meeting_Notes1" HeaderText="Meeting_Notes1" SortExpression="Meeting_Notes1" />
<asp:BoundField DataField="Meeting_Topic2" HeaderText="Meeting_Topic2" SortExpression="Meeting_Topic2" />
<asp:BoundField DataField="Meeting_Notes2" HeaderText="Meeting_Notes2" SortExpression="Meeting_Notes2" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource9" runat="server" ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString1 %>"
DeleteCommand="DELETE FROM [Meeting] WHERE [Meeting_ID] = @dotnet.itags.org.Meeting_ID" InsertCommand="INSERT INTO [Meeting] ([Meeting_Date], [Meeting_Title], [Meeting_Description], [Meeting_Topic1], [Meeting_Notes1], [Meeting_Topic2], [Meeting_Notes2]) VALUES (@dotnet.itags.org.Meeting_Date, @dotnet.itags.org.Meeting_Title, @dotnet.itags.org.Meeting_Description, @dotnet.itags.org.Meeting_Topic1, @dotnet.itags.org.Meeting_Notes1, @dotnet.itags.org.Meeting_Topic2, @dotnet.itags.org.Meeting_Notes2)"
ProviderName="<%$ ConnectionStrings:CORE2062ConnectionString1.ProviderName %>"
SelectCommand="SELECT [Meeting_ID], [Meeting_Date], [Meeting_Title], [Meeting_Description], [Meeting_Topic1], [Meeting_Notes1], [Meeting_Topic2], [Meeting_Notes2] FROM [Meeting]"
UpdateCommand="UPDATE [Meeting] SET [Meeting_Date] = @dotnet.itags.org.Meeting_Date, [Meeting_Title] = @dotnet.itags.org.Meeting_Title, [Meeting_Description] = @dotnet.itags.org.Meeting_Description, [Meeting_Topic1] = @dotnet.itags.org.Meeting_Topic1, [Meeting_Notes1] = @dotnet.itags.org.Meeting_Notes1, [Meeting_Topic2] = @dotnet.itags.org.Meeting_Topic2, [Meeting_Notes2] = @dotnet.itags.org.Meeting_Notes2 WHERE [Meeting_ID] = @dotnet.itags.org.Meeting_ID">
<InsertParameters>
<asp:Parameter Name="Meeting_Date" Type="DateTime" />
<asp:Parameter Name="Meeting_Title" Type="String" />
<asp:Parameter Name="Meeting_Description" Type="String" />
<asp:Parameter Name="Meeting_Topic1" Type="String" />
<asp:Parameter Name="Meeting_Notes1" Type="String" />
<asp:Parameter Name="Meeting_Topic2" Type="String" />
<asp:Parameter Name="Meeting_Notes2" Type="String" />
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="Meeting_Date" Type="DateTime" />
<asp:Parameter Name="Meeting_Title" Type="String" />
<asp:Parameter Name="Meeting_Description" Type="String" />
<asp:Parameter Name="Meeting_Topic1" Type="String" />
<asp:Parameter Name="Meeting_Notes1" Type="String" />
<asp:Parameter Name="Meeting_Topic2" Type="String" />
<asp:Parameter Name="Meeting_Notes2" Type="String" />
<asp:Parameter Name="Meeting_ID" Type="Int32" />
</UpdateParameters>
<DeleteParameters>
<asp:Parameter Name="Meeting_ID" Type="Int32" />
</DeleteParameters>
</asp:SqlDataSource>
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
<script language="vbscript" runat="server">
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
Dim filename = "upload/" & FileUpload1.PostedFile.FileName
If FileUpload1.HasFile Then
Try
FileUpload1.SaveAs(Server.MapPath("~/upload/") & _
FileUpload1.FileName)
Label1.Text = "File name: " & "upload/" & _
FileUpload1.PostedFile.FileName & "<br>" & _
"File Size: " & _
FileUpload1.PostedFile.ContentLength & " kb<br>" & _
"Content type: " & _
FileUpload1.PostedFile.ContentType
Catch ex As Exception
Label1.Text = "ERROR: " & ex.Message.ToString()
Label2.Text = filename
End Try
Else
Label1.Text = "You have not specified a file."
End If
End Sub
</script>
<asp:SqlDataSource ID="SqlDataSource2" runat="server" ConflictDetection="CompareAllValues"
ConnectionString="<%$ ConnectionStrings:CORE2062ConnectionString1 %>" DeleteCommand="DELETE FROM [Events] WHERE [EventID] = @dotnet.itags.org.original_EventID AND [EventName] = @dotnet.itags.org.original_EventName AND [EventDate] = @dotnet.itags.org.original_EventDate"
InsertCommand="INSERT INTO [Events] ([EventName], [EventDate]) VALUES (@dotnet.itags.org.EventName, @dotnet.itags.org.EventDate)"
OldValuesParameterFormatString="original_{0}" SelectCommand="SELECT * FROM [Events]"
UpdateCommand="UPDATE [Events] SET [EventName] = @dotnet.itags.org.EventName, [EventDate] = @dotnet.itags.org.EventDate WHERE [EventID] = @dotnet.itags.org.original_EventID AND [EventName] = @dotnet.itags.org.original_EventName AND [EventDate] = @dotnet.itags.org.original_EventDate">
<DeleteParameters>
<asp:Parameter Name="original_EventID" Type="Int32" />
<asp:Parameter Name="original_EventName" Type="String" />
<asp:Parameter Name="original_EventDate" Type="DateTime" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="EventName" Type="String" />
<asp:Parameter Name="EventDate" Type="DateTime" />
<asp:Parameter Name="original_EventID" Type="Int32" />
<asp:Parameter Name="original_EventName" Type="String" />
<asp:Parameter Name="original_EventDate" Type="DateTime" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="EventName" Type="String" />
<asp:Parameter Name="EventDate" Type="DateTime" />
</InsertParameters>
</asp:SqlDataSource>
</asp:Content

Hi,

According to my understanding to your problem, it's ActiveTabIndex isn't maintained between postback.

You can refer to this thread talks about the same thing and try the workaround in it.

http://forums.asp.net/t/1157255.aspx