AJAX Tabs/TabPanels - Hovering different tab reloads page?

I'm using ASP.NET and i"m new with AJAX. I have some datagrids where I'm editing multiple lines. I thought it would look better to have each Datagrid inside an AJAX tab. I was right. I'd like to update the data in the datagrids all at once. I have a button that does that. Once the button is clicked, the data starts being written into a database, but if i hover a different tab on accident/on purpose the function performed by clicking the button automatically stops. The same thing happens on a hyperlink. If i click a hyperlink and hover a tab before the new page loads, the new page doesn't load. I'm sure this problem is something stupid I'm overlooking, but can somebody help me out? Thanks in advance.

Bump.

Bump, maybe I need to somehow change the AutoPostBack settings within AJAX? Anyone?

Hi,

It's hard to say where the exact cause lying on, Can you show me a simple repro?

Thanks

Well, here is an example where it happens..... http://ajax.asp.net/ajaxtoolkit/Tabs/Tabs.aspx

If you click the email tab, then click the cascading drop down link......as soon as you click it, hover the Signature and Bio tab. The clicked link will not load. This has to be done extremely quickly in this example. Everytime you hover a tab, it seems to refresh something on the page. In my code, I used their SampleWebSite to make my tabs. The big difference is that I'm clicking a link/button that performs database operations which take 4-5 seconds to load rather than 1 second like the example from their webpage. So, if someone clicks a link or update button that accesses my database, I don't want the actions in the background to stop when a tab is hovered. This is not good for the average customer/user. For a day or so, I was hovering the tabs on accident because at the time, my hyperlink was immediate above the tabs. Since then, I've moved it to the bottom of the page under the tab panel, but I still don't won't the hovering to stop running what is occuring on the server. Thanks.

AJAX TabPanels and user defined controls

Hi,

I've built a control in which I implement the behaviour described in this video:How Do I: Trigger an UpdatePanel Refresh from a DropDownList Control? Basically, I want to update the nodes of a TreeView when I change the item in a DropDownList.

This works great except if I load the control dynamically into a tab panel...In this case, the first SelectedIndexChanged event doesn't trigger anything and all of the following events trigger a full page postback...

So, to sum this up:

User control statically defined in a page -> OKUser control statically defined in a tab panel -> OK (it works when I put the code of the control inside the tab panel)User control dynamically loaded into a placeholder -> OK (using PlaceHolder1.Controls.Add(Page.LoadControl("WebUserControl.ascx"));)User control dynamically loaded into a tab panel -> NOT OK! (using both TabPanel1.Controls.Add(Page.LoadControl("WebUserControl.ascx")); and TabPanel1.ContentTemplate = Page.LoadTemplate("WebUserControl.ascx");)

I can't put the code of the control inside the tab panel statically (point 2 in the previous list) because the tab panels are being generated dynamically also...

Anyone has suggestions to solve this, please??

When are you adding these dynamically created controls? It sould be during the Page_Init event and not later (such as during the Page_Load).

I'm not adding the controls in the Page_Init as I can't do that...when my page first loads it has only a DropDownList with a list of options.

Then, when the selected option is changed, there is a postback (as the DropDownList has AutoPostBack = "True") and only then the tabs are created and the user control is loaded.

The user defined control is being rendered and is visible, but its behaviour is strange...

If you dynamically add your contorls into an updatepanel, the issue comes.

There are few good articles written byScott Mitchell on dynamically loading Controls which you will find in the following links:

Dynamic Controls in ASP.NETWorking with Dynamically Created ControlsDynamic Web Controls, Postbacks, and View State

AJAX Tabpanel - Runs slow on IE 7.0 but very fast on FireFox?

Folks,

I am using AJAX.net TabContainer control with 5 tabpanels in it. Each tabpanel has an update panel [update mode is "conditional"] and inside the update panel, I have a gridview control [Editable]. Now, I also have a "Save" button in each of the update panels, that will save the data I enter in the "GridView". The idea is, to update only the "current tab" when I click on "Save"

The problem is that, the code runs very fast on FireFox [meaning, the update is almost instantaneous]. However, on IE7, the update takes thrice as much time as the "FireFox". I think the Javascript runs slow on IE7

Any help or thoughts?

-Thanks

Any one from the AJAX Team?

ive experienced the same thing..very slow for IE rendering..3-4 second pause before the page renders to the screen versus FireFox which just pops up the content without a delay.

I also had the same problem. Actually i had two TabContainers on one page and i not checked firefox but it was very slow in IE and for that reason i removed tabcontainer from my code. Any reason for it being slow and any help in making it fast would be appriciated. Thanks.
Same here. I had to load several text areas into about 9 tabs. This text was really slagging IE. I ended up using a dropdownlist to choose which tabpanel to make visible instead of loading them all at once.

Hehehe... back in the bad old days before AJAX, I made tab-panels from the wizard control with some CSS work. Then when the AJAX extensions came along, I just droped the wizard into an update panel, and it worked great... 10 second job. Then I started converting these to the TabContainer / TabPanel when the AjaxControlToolkit came out. I have pretty much learned that I wasted my time because of the perfomance issues... it is "faster" on FireFox, but still has poor performance. Thank god for backups.

I have a similar sitiuation. I have 4 tabpanels, one tab has a selectable gridview and associated formview wrapped in an update panel. The other three tabs contain editable gridviews wrapped in update panels. One of three gridviews has two dropdownlists as columns with 8000+ selections. When I click on edit on a row using IE the row enters edit mode in around 4 seconds. If I then click on update or cancel it takes over 2 minutes to repaint; using Firefox it repaints in 5 seconds.

If I get rid of the update panels all is well in IE. If I leave the update panels and replace the dropdownlists with textboxes all is well in IE. Big dropdowns in updatepanel wrapped gridview columns seems to be a problem in IE. Firefox handles fine.

Any ideas??? I've Googled and tried things for two days to no avail?

AJAX TabContiner control

I am using the tabcontiner control, upon which I have placed 4 tabpanels. Based on the user clicking a button on one tab, I need to be able to disable all other tabs to prevent the user moving away unless they complete the operation, or cancel. I have tried to use the following

TabPanel1.Enabled =True

and

Me.TabContainer1.Tabs(0).Enabled =False

Unfortunately I have had no luck, any suggestions?

Michael.

When you set the TabPanel.Enabled = false it will disappear as I have just tested. I don't know if this is the desired effect that you are looking for or not.

You may want to set the AutoPostBack to true and then hook up an event to OnClientActiveTabChanged so that you can disable the other tabs. Of course you will want to wrap an update panel around the tabcontainer for a better client experience.

I hope this helps.

Hi Jim

Making the tabs disappear would be an acceptable solution, however, the above command will not even do this for me. I will give a look at your solution.

Michael.