Saturday, March 24, 2012

TabContainer and DynamicServicePath

I am using a TabContainer and I would like to display the content of an aspx file inside each TabPanel of the TabContainer. I tried this code :

<ajaxToolkit:TabContainerrunat="server"ID="Tabs"Height="600px"Width="600px">

<ajaxToolkit:TabPanelrunat="server"ID="Panel1"HeaderText="Product Groups"DynamicServicePath="~/ConfProductGroup.aspx"Visible="true">

<ContentTemplate>

</ContentTemplate>

</ajaxToolkit:TabPanel>

<ajaxToolkit:TabPanelrunat="server"ID="Panel3"HeaderText="Products"DynamicServicePath="~/ConfProduct.aspx"Visible="true"/>

</ajaxToolkit:TabContainer>

But the tabcontainer doesn't display the content of aspx pages (ConfProduct.aspx , ConfProductGroup.aspx) when I click on a TabPanel.

Hi Suzi,

If you want to contain an entire asp.net page inside a TabPanel, you will probably need to fetch it prgramatically.

This video will show you how to do it.

http://asp.net/learn/videos/view.aspx?tabid=63&id=120

Joe


Thank you Joe for your advice. I am trying to test with this solution.


I am trying a sample example as you advice me. I have a Master page and an aspx page named Ajaxtab.aspx. I have no error when I test the Ajaxtab.aspx without a Master Page File. But if I add a master page file. I have an unknown error . Below, you will find my code. Thank you.

ajaxtab.aspx :

<%@.PageLanguage="C#"AutoEventWireup="true"MasterPageFile="~/Site.master"CodeFile="Ajaxtab.aspx.cs"Inherits="Tests_Ajaxtab"Title="MediterrumWorks : Ajaxtab" %>

<%@.MasterType

virtualpath="~/Site.master" %>

<%@.Register

Assembly="AjaxControlToolkit"

Namespace="AjaxControlToolkit"

TagPrefix="ajaxToolkit" %>

<asp:Content

ID="MainContent"

ContentPlaceHolderID="MainContent"

Runat="Server">

<divid="ResultId0"style="background-color:Aqua;"/>

</asp:Content>

and my master page :

<%@.MasterLanguage="C#"AutoEventWireup="true"CodeFile="Site.master.cs"Inherits="Site" %>

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

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Mediterrum Works</title>

<linkrel="stylesheet"type="text/css"href="ajax__calendar.css"/>

</head>

<body>

<scripttype="text/javascript"language="Javascript">

function showHideLogo(){

var topbanner=window.document.getElementById('topbanner');

var arrow_top=window.document.getElementById('arrow_top');

if(topbanner.style.display=="none"){

topbanner.style.display="block";

document.images["arrow_top"].src="images/top_arrow_hide.gif";

document.images["arrow_top"].style.height="7px";

}else{

topbanner.style.display="none";

document.images["arrow_top"].src="images/top_arrow.gif";document.images["arrow_top"].style.height="7px";

}

}

function updateTime()

{

var label = document.getElementById('<%= CurrentTime.ClientID %>');

if (label) {

var time = (new Date()).localeFormat(" d/MM/yyyy ");var time = time +" " + (new Date()).localeFormat(" HH:mm ");

label.innerHTML = time;

}

}

updateTime();

window.setInterval(updateTime, 1000);

// Select a collection of CheckBoxList clicking on a CheckBoxList

function SelectAllCheckboxes(spanChk, chbxID)

{

var theBox= (spanChk.type=="checkbox") ? spanChk : spanChk.children.item[0];

xState=theBox.checked;

elm=theBox.form.elements;

for(i=0;i<elm.length;i++)if(elm[i].type=="checkbox" && elm[i].id!=theBox.id)

{

var checkbox = elm[i];

// If a search parameter was passed in

if(chbxID)

{

// Check only thos checkboxes with an ID containing that parameter

if(checkbox.id.search(chbxID) != -1)

{

if(elm[i].checked!=xState)

elm[i].click();

}

}

// No search parameter, just check all checkboxes on the form

else

{

if(elm[i].checked!=xState)

elm[i].click();

}

}

}

</script>

<divid="container">

<formid="navtop"

runat="server"

style="margin: 0px">

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

<Scripts>

<asp:ScriptReferencePath="WebRequest.js"/>

</Scripts>

</asp:ScriptManager>

<asp:HiddenFieldID="aspHFvisible"Value="true"runat="server"/>

<divid="topbanner">

<tablecellpadding="0"cellspacing="0"border="0"width="100%">

<tr>

<td>

<img

src="images/TerrumWorks.gif"

alt="Semantic Solutions"

style="margin: 0px"/>

</td>

<td>

</td>

<tdstyle="text-align: left">

<imgsrc="images/userOnline.gif"height="16px"width="16px"alt=""/>

<asp:LoginName

ID="LoginName2"

runat="server"/>

</td>

<tdstyle="text-align: right">

<asp:LoginStatus

ID="LoginStatus2"

runat="server"

LogoutAction="RedirectToLoginPage"/>

</td>

</tr>

</table>

</div>

<divid="div-menu">

<tablecellpadding="0"cellspacing="1"border="0"width="100%">

<tr>

<td>

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

<ContentTemplate>

<asp:Menu

DataSourceID="SiteMapDataSource1"

ID="Menu1"

runat="server"

CssClass="navmenu"

Orientation="Horizontal"

StaticTopSeparatorImageUrl="~/images/ToolSep.gif"OnMenuItemClick="Menu1_MenuItemClick">

<StaticMenuItemStyle

CssClass="menuitem"/>

<StaticSelectedStyle

CssClass="menuselected"/>

<StaticHoverStyle

CssClass="menuitemhover"/>

<DynamicHoverStyle

BorderWidth="1px"

CssClass="menuitemhover"/>

<DynamicMenuItemStyle

CssClass="menuitem"/>

</asp:Menu>

<asp:SiteMapDataSource

ID="SiteMapDataSource1"

runat="server"

ShowStartingNode="False"/>

</ContentTemplate>

</asp:UpdatePanel>

</td>

</tr>

</table>

</div>

<divid="toolbar"style="clear: both">

<tablewidth="100%"cellpadding="0"cellspacing="1">

<tr>

<tdalign="left"width="15%"style="border:solid 0px black">

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

<ProgressTemplate>

<table><tr><td>

<imgalt="Please Wait"height="13px"src="images/progressbar_long.gif"/>

</td>

<td>

<asp:Labelrunat="server"Text="Loading ..."/>

</td>

</tr></table>

</ProgressTemplate>

</asp:UpdateProgress>

</td>

<tdalign="left"width="35%"style="border:solid 0px black">

<asp:contentplaceholder

id="ContentPlaceHolderToolbar"

runat="server">

<asp:UpdatePanelID="aspUpdToolBarMessage"UpdateMode="Conditional"runat="server">

<ContentTemplate>

<asp:Image

ID="imgErrorMessage"

runat="server"

ImageUrl="~/images/red-error.gif"

Visible="True"Height="12px"/>

<asp:Label

ID="lblErrorMessage"

runat="server"

Visible="True"

CssClass="ErrorMessage"/>

<asp:Image

ID="imgLblMessage"

runat="server"

ImageUrl="~/images/info.gif"

Visible="True"/>

<asp:Label

CssClass="Message"

ID="aspLblMessage"

runat="server"/>

</ContentTemplate>

</asp:UpdatePanel>

</asp:contentplaceholder>

</td>

<tdalign="center"width="25%"style="border:solid 0px black">

<imgid="arrow_top"onclick="showHideLogo()"alt=""height="7px"src="images/top_arrow_hide.gif"/>

</td>

<tdalign="right"class="rightTable"width="25%"style="border:solid 0px black">

<spanid="CurrentTime"runat="server"class="toolbartime"/> |

<asp:Label

ID="AppVersion"

runat="server"

CssClass="toolbarversion"/>

</td>

</tr>

</table>

</div>

<divid="content">

<!-- Starting region layout for Sample Window -->

<asp:contentplaceholder

id="MainContent"

runat="server">

</asp:contentplaceholder>

<!-- Ending region layout for Sample Window -->

</div>

</form>

<divid="footer">

<tablewidth="100%"border="0">

<tr>

<td>

<address>

<asp:Literal

ID="footeraddress"

runat="server"

Text="<%$ Resources:Resource, FooterCopyright %>">

</asp:Literal></address>

</td>

<tdalign="right"valign="bottom">

</td>

</tr>

</table>

</div>

</div>

</body>

</html>


Hi,

I can't see where in your page is implementing incremental page.

Can you watch the video again and implement a similar feature?

If it still fails, can you provide a simpler page with less elements but include the problem you have?


Additional tip, you can useiFrame to include another form in current page.

No comments:

Post a Comment