This is a migrated thread and some comments may be shown as answers.

Ajax MasterPage

1 Answer 131 Views

Ajax

This is a migrated thread and some comments may be shown as answers.

Michael asked on 11 Sep 2010, 07:25 PM

I have setup an ajax masterpage which has a skinmanager and a radformdecorator on it.

I only have one aspx page which dynamically loads in user controls into the content placeholder based on the tab selected.

Below are two questions I am currently stuck on if anyone can help me.

Inside MyAccount.ascx I have a combo box which allows the user to select a skin to use which is working fine for the skin manager, but I keep receiving an error when trying to hook up the radformdecorator.
Inside Header.ascx I am dynamically adding the following tabs 'home' and 'contact us' on the first page load and not on any postback. This stops the tabs from repeating everytime the page is posted back. However depending on who logs in, i need to add another two tabs to the radtabstrip, 'My Account' if a user logs in and 'Admin' if an admin logs in. Also they need to be removed when they log out. Can this be done?

Master Page HTML:

<%@ Master Language="VB" CodeFile="MasterPage.master.vb" Inherits="MasterPage" %>

<%@ Register TagPrefix="UC" TagName="Header" Src="~/Header.ascx" %>

<!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></title>

<asp:ContentPlaceHolder id="head" runat="server">

</asp:ContentPlaceHolder>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="ScriptManager" runat="server" />

<telerik:RadSkinManager runat="server" ID="RadSkinManager" Enabled="true" ></telerik:RadSkinManager>

<telerik:RadAjaxManager ID="RadAjaxManager" runat="server" />

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" MinDisplayTime="1000" Skin="Vista" IsSticky="true">

<asp:Image ID="Image1" runat="server" ImageUrl="~/loading.gif" AlternateText="Loading.." /></telerik:RadAjaxLoadingPanel>

<telerik:RadFormDecorator runat="server" ID="RadFormDecorator" EnableAjaxSkinRendering="true" DecoratedControls="All" Enabled="true" />

<div>

<UC:Header ID="Header" runat="server" /> <br />

<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>

</div>

</form>

</body>

</html>

Header.ascx HTML:

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="Header.ascx.vb" Inherits="Header" %>

<asp:Panel runat="server" ID="PanelHeader">

<table>

<tr>

<td>

<telerik:RadTabStrip ID="HeaderTabStrip" runat="server" SelectedIndex="0" EnableAjaxSkinRendering="true"></telerik:RadTabStrip>

</td>

</tr>

</table>

</asp:Panel>

<script type="text/javascript">

// the code below will allow the tab to be reselected

Telerik.Web.UI.RadTab.prototype.select = function (e)

{

var parent = this.get_parent();

if (!parent)

{

this._cachedSelected = true;

return true;

}

var shouldNavigate = this._shouldNavigate();

var selectedTab = parent.get_selectedTab();

var tabStrip = this.get_tabStrip();

//these lines are commented so the tabstrip postbacks even if you click on the selected tab

// if (!shouldNavigate && selectedTab == this && !tabStrip.get_clickSelectedTab())

// return false;

if (tabStrip._raiseCancelEvent("tabSelecting", this, e))

return false;

var suppressVisualUpdate = this._shouldPostBack() || (shouldNavigate && (!this.get_target() || this.get_target() == "_self"));

if (!e)

suppressVisualUpdate = false;

if (selectedTab && selectedTab != this)

selectedTab.unselect(suppressVisualUpdate, e);

parent._setSelectedIndex(this.get_index());

tabStrip._registerSelectedTab(this);

if (!suppressVisualUpdate)

{

this._updateAppearance(true);

this._updateSiblings(true);

this._setChildListDisplay("");

if (this._scroller)

{

this._scroller._showArrows();

}

else

{

tabStrip._scrollInitInProgress = true;

this._initScrolling();

tabStrip._scrollInitInProgress = false;

}

if (tabStrip._reorderTabsOnSelect)

Telerik.Web.UI.RadTabStrip._reorderTabs(parent.get_childListElement(), this.get_element());

}

if (tabStrip.get_multiPage())

this._selectPageView(suppressVisualUpdate);

tabStrip._raiseEvent("tabSelected", this, e);

return true;

}

</script>

Header.ascx Code behind:

Imports Telerik.Web.UI

Partial Class Header

Inherits System.Web.UI.UserControl

Protected Sub HeaderTabStrip_TabClick(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadTabStripEventArgs) Handles HeaderTabStrip.TabClick

Dim ctrlID As String = Nothing

Select Case e.Tab.Value

Case 0

ctrlID = "Home.ascx"

Exit Select

Case 1

ctrlID = "MyAccount.ascx"

Exit Select

Case 2

ctrlID = "Admin.ascx"

Exit Select

Case 3

ctrlID = "ContactUs.ascx"

Exit Select

End Select

If TypeOf (Page) Is BasePage Then

Dim CPage As BasePage = CType(Page, BasePage)

Dim PanelContent As Panel = DirectCast(CPage.Content("ContentPlaceHolder1").FindControl("PanelContent"), Panel)

If (PanelContent IsNot Nothing) Then

CPage.LoadUserControl(ctrlID, PanelContent)

Else

' load an error message here

End If

End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

If (Not Page.IsPostBack) Then

' make these tabs DB driven based on user role!

' I want My Account and Admin tabs to only appear if user is logged in and based on their role.

AddTab("Home", 0, True)

AddTab("My Account", 1, True)

AddTab("Admin", 2, True)

AddTab("Contact Us", 3, True)

End If

Dim AjaxManager As RadAjaxManager = RadAjaxManager.GetCurrent(Page)

Dim panel As Panel = DirectCast(Me.Page.Master.FindControl("ContentPlaceHolder1").FindControl("PanelContent"), Panel)

If (panel IsNot Nothing) Then

AjaxManager.AjaxSettings.AddAjaxSetting(HeaderTabStrip, panel)

End If

AjaxManager.AjaxSettings.AddAjaxSetting(HeaderTabStrip, PanelHeader)

End Sub

' adds the tab to the tab strip

Private Sub AddTab(ByVal ID As String, ByVal val As Integer, ByVal bVisible As Boolean)

Dim tab As RadTab = New RadTab()

tab.Value = val

tab.Text = ID.Replace(" ", "")

tab.Visible = bVisible

HeaderTabStrip.Tabs.Add(tab)

End Sub

End Class

MyAccount.ascx html

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="MyAccount.ascx.vb" Inherits="MyAccount" %>

My Account UC<br /><br />

Skin:

<telerik:RadComboBox ID="DDLSkinChooser" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DDLSkinChooser_SelectedIndexChanged" EnableAjaxSkinRendering="true" >

<Items>

<telerik:RadComboBoxItem runat="server" Text="WebBlue" Value="WebBlue" />

<telerik:RadComboBoxItem runat="server" Text="Vista" Value="Vista" />

<telerik:RadComboBoxItem runat="server" Text="Black" Value="Black" />

<telerik:RadComboBoxItem runat="server" Text="Outlook" Value="Outlook" />

<telerik:RadComboBoxItem runat="server" Text="Hay" Value="Hay" />

</Items>

</telerik:RadComboBox><br /><br />

<asp:Button runat="server" ID="btnTest" Text="My Test" />

MyAccount.ascx code behind:

Imports Telerik.Web.UI

Partial Class MyAccount

Inherits System.Web.UI.UserControl

Protected Sub DDLSkinChooser_SelectedIndexChanged(ByVal o As Object, ByVal e As Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs) Handles DDLSkinChooser.SelectedIndexChanged

RadSkinManager.GetCurrent(Page).Skin = e.Text

Dim RadFormDecorator As RadFormDecorator = DirectCast(Page.Master.FindControl("RadFormDecorator"), RadFormDecorator)

If (RadFormDecorator IsNot Nothing) Then

RadFormDecorator.Skin = e.Text

RadFormDecorator.EnableAjaxSkinRendering = True

End If

DDLSkinChooser.EnableAjaxSkinRendering = True

Dim radtab As RadTabStrip = CType(Me.Page.Master.FindControl("Header").FindControl("HeaderTabStrip"), RadTabStrip)

If (radtab IsNot Nothing) Then

radtab.EnableAjaxSkinRendering = True

End If

End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

Dim AjaxManager As RadAjaxManager = RadAjaxManager.GetCurrent(Page)

Dim panel As Panel = CType(Me.Page.Master.FindControl("ContentPlaceHolder1").FindControl("PanelContent"), Panel)

If (panel IsNot Nothing) Then

AjaxManager.AjaxSettings.AddAjaxSetting(DDLSkinChooser, panel)

End If

' Adding this in for radformdecorator produces an error

'Dim RadFormDecorator As RadFormDecorator = DirectCast(Page.Master.FindControl("RadFormDecorator"), RadFormDecorator)

'If (RadFormDecorator IsNot Nothing) Then

'AjaxManager.AjaxSettings.AddAjaxSetting(DDLSkinChooser, RadFormDecorator)

'End If

Dim PanelHeader As Panel = CType(Me.Page.Master.FindControl("Header").FindControl("PanelHeader"), Panel)

If (PanelHeader IsNot Nothing) Then

AjaxManager.AjaxSettings.AddAjaxSetting(DDLSkinChooser, PanelHeader)

End If

End Sub

End Class

Any help would be greatly appreciated.

Thank you.

1 Answer, 1 is accepted

answered on 14 Sep 2010, 12:00 PM

radskinmanagerandradformdecorator.zip

Hi Michael,

I tried replicating the first issue in the attached sample but to no avail. Can you check it out and let me know if I missed something out?

Regarding your second question: You can try adding the RadTabs and RadPageViews dynamically on Page_Load in order to achieve your goal:

http://demos.telerik.com/aspnet-ajax/tabstrip/examples/applicationscenarios/dynamicpageview/defaultcs.aspx

Best wishes,
Iana
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items