Showing posts with label tabcontainer. Show all posts
Showing posts with label tabcontainer. Show all posts

Wednesday, March 28, 2012

Linkbuttons in a TabContainer lose the active tab

Hi, I have a tabcontainer with a couple of panels. If I have a Button in each panel then clicking the button posts the page back and the tab panel I was in remains active/visible. BUT if I put a link button in Panel 2 and click that then the tabcontainer resets to the first panel.

Here is a simple example:

<cc1:TabContainer ID="TabContainer1" runat="server">
<cc1:TabPanel ID="TabPanel1" runat="server" HeaderText="tab 1">
<ContentTemplate>
<asp:Button runat="server" ID="Button1" Text="postback 1" />
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="TabPanel2" runat="server" HeaderText="tab 2"> <ContentTemplate>

<asp:LinkButton runat=server ID=lnk1>postback from panel 2</asp:LinkButton>
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>

If I put a button in panel 2 as well as the linkbutton then I get the same thing, BUT if I click the Button first then clicking the link button does not cause the tabcontainer to reset. Which seems to suggest that AJAX is using a button event in some way, but not a linkbutton.

This is causing me a major headache as I have already designed the UI and coded all the DB and middle-tier code, wiring the UI up was supposed to be the easy bit!Wink

Hoping someone can help

Andrew

This problem has been logged with the AJAX Control Toolkit developers as an issue and a workaround is detailed here:http://forums.asp.net/thread/1550723.aspx (basically wrap the tabcontainer in an update panel so that the non-Button postbacks get routed through the AJAX async handlers)

Wednesday, March 21, 2012

loading an aspx page in ajax updatepanel

Is there a way to load an aspx page in the updatepanel or into a ajax tabcontainer control? Please advise

The only way that I have heard of is using iFrames, but we haven't used that because either page transitions don't matter to us or end up using a different technique to change the content in a particular area of the page (it depends on the page).

Loading external .aspx file into AJAX Toolkit TabPanel

Hello,

I'm new to ASP.NET AJAX. I want to create a default page, maybe a master page. then i want to add the AJAX Toolkit TabContainer with different TabPanels for each of my other .aspx files (home.aspx, about.aspx, etc.) I want to know how I would setup the TabContainer with a tabpanel for each page and load those pages when the appropriate Tab is clicked. a small snippet of example code would be greatly appreciated

Thanks to all in advance

GL

How about something like this?

<ajaxToolkit:TabContainer ID="tabs" runat="server" Width="600px" Height="400px">
<ajaxToolkit:TabPanel ID="tabHome" runat="server" HeaderText="Home">
<ContentTemplate>
<iframe src="http://pics.10026.com/?src=home.aspx" width="100%" height="100%">
</iframe>
</ContentTemplate>
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="tabAbout" runat="server" HeaderText="About">
<ContentTemplate>
<iframe src="http://pics.10026.com/?src=about.aspx" width="100%" height="100%">
</iframe>
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>


Thanksctafield, that did the trick. works like a charm but I wonder if there might be another way besides frames. I dont like to use frames plus i'm concerned about browsers that may not support frames. Thank you for the quick response

If there is another way I would greatly appreciate the guide

Thanks

GL


Ok, When I used the iframe my pages end up having 2 separate vertical scrollbars. one for the main window and one for the iframe region. i cna see that confusing my users when they need to scroll up or down. has anyone thought of another solution?

you can actually turn off the scrollbars for the iframe - just make sure you set its width and height to 100% so data doesn't get chopped and that would get rid of the scrollbar for the iframe...

<

iframeid="TargetPane"scrolling="no"


Hi,

You might also be interested in reading one of Scott Guthrie'sblog posts where he created a class called ViewManager to render ASP.NET controls to HTML and send it via a webservice to the page.

Thanks,
Ted


You can add WebControls (.ascx) to each panel you want by using following code-behind:

AjaxControlToolkit.TabPanel tpHome = new AjaxControlToolkit.TabPanel();
tpHome.HeaderText = "Home";
tpHome.ContentTemplate = Page.LoadTemplate("Home.ascx");
tcDefault.Tabs.Add(tpHome);

AjaxControlToolkit.TabPanel tpAbout = new AjaxControlToolkit.TabPanel();
tpAbout.HeaderText = "About";
tpAbout.ContentTemplate = Page.LoadTemplate("About.ascx");
tcDefault.Tabs.Add(tpAbout);

tcDefault is TabContainer control.


AjaxControlToolkit.TabPanel tab = new AjaxControlToolkit.TabPanel();
tab.HeaderText = "test_new_tab";
TabContainer1.Tabs.Add(tab);

??index error WHY?

Good piece of code to use the control on the code behind.
Even the control toolkit samples didn't have these in detail

However i couldn't load an external page onto the page.loadtemplate method
It throws the following error when trying with full path


Exception Details:System.Web.HttpException: 'http://localhost:8080/Documents/9245/bjk49000.PDF' is not a valid virtual path.

Any suggestions?

Rain Man


At the moment i'm using the following method by coding on the client end

<ajaxToolkit:TabPanel runat="server" ID="TabPanelAttachment" HeaderText="Attachments">
<ContentTemplate>
<iframe runat="server" id="iframePreview" width="850" height="800" frameborder ="0"> </iframe>
</ContentTemplate>
</ajaxToolkit:TabPanel
var urlPrefix = "http://localhost:8080/Documents/"
var urlSuffix = docId + "/" + fileName;
var url = urlPrefix + urlSuffix;

$find('TabContainerDocument').set_activeTabIndex(1);
document.getElementById('TabContainerDocument_TabPanelAttachment_iframePreview').src = url;

TabContainerDocument_TabPanelAttachment_iframePreview is the iframe id at run time
Hope that helps for someone who is trying on something similar

Happy coding

Rain Man


This reallyhas to be built into the TabPanel tool.


Haven't tried this but it might be another alternative to controls and iFrames...

Dynamic drive website has example of using Javascript to do page calls to a div, not too sure if will work in but might be good for a try?

http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm

Dave