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

RadTabstrip+RadMultipage problem

5 Answers 204 Views

TabStrip

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

Dorababu asked on 04 Jun 2012, 11:52 AM

First.png

second.png

Hi all I am having my RadTabstrip designed as follows

<telerik:RadTabStrip ID="rdtabEmployee" runat="server" MultiPageID="rdmpPersonal"

UnSelectChildren="True" Skin="Vista" EnableEmbeddedSkins="False" ClickSelectedTab="True"

AutoPostBack="True" SelectedIndex="0">

<Tabs>

<telerik:RadTab runat="server" Text="Taxes">

<Tabs>

<telerik:RadTab runat="server" Text="Residence" Selected="true" PageViewID="rdpgResident">

</telerik:RadTab>

<telerik:RadTab runat="server" Text="Work" PageViewID="rdpgWork">

</telerik:RadTab>

<telerik:RadTab runat="server" Text="UnEmployment">

</telerik:RadTab>

<telerik:RadTab runat="server" Text="Withholding">

</telerik:RadTab>

</Tabs>

</telerik:RadTab>

</Tabs>

My RadMultiPage is designed as follows

<telerik:RadMultiPage ID="rdmpPersonal" runat="server" SelectedIndex="0"> <telerik:RadPageView ID="rdpgResident" runat="server" Selected="true">

<telerik:RadPanelBar runat="server" ID="rdpbResidence" ExpandMode="FullExpandedItem"

Skin="Vista" EnableEmbeddedSkins="false" Width="550px">

<Items>

<telerik:RadPanelItem Expanded="true" Text="Resident Location" runat="server" Selected="true">

<Items>

<telerik:RadPanelItem Value="Resident" runat="server">

<ItemTemplate>

<div class="text" style="background-color: #edf9fe">

<ul class="formList" id="residenceInfo">

<li>

<asp:Label ID="lblTaxAutority" AssociatedControlID="rdcmbTaxAuthority" Width="150px"

runat="server" Text="Tax Authority"></asp:Label>

<telerik:RadComboBox runat="server" OnSelectedIndexChanged="rdcmbTaxAuthority_SelectedIndexChanged"

ID="rdcmbTaxAuthority" CssClass="ComboBox" AutoPostBack="true" Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdresTaxAuthority" runat="server"

ErrorMessage="Select Tax Authority" ControlToValidate="rdcmbTaxAuthority" ValidationGroup="vgResident"

CssClass="error"></asp:RequiredFieldValidator>

</li>

<li>

<asp:Label ID="lblCountry" AssociatedControlID="rdcmbCounty" Width="150px" runat="server"

Text="Country"></asp:Label>

<telerik:RadComboBox runat="server" ID="rdcmbCounty" OnSelectedIndexChanged="rdcmbCountry_SelectedIndexChanged"

CssClass="ComboBox" AutoPostBack="true" Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdresCountry" InitialValue="--select--" runat="server"

ErrorMessage="Select Country" ControlToValidate="rdcmbCounty" ValidationGroup="vgResident"

CssClass="error"></asp:RequiredFieldValidator>

</li>

<asp:Panel ID="pnlresTaxAuthority" runat="server" Visible="false">

<li>

<asp:Label ID="lblresidentLocaltaxauthority" AssociatedControlID="rdcmbresidentLocalTaxAuthority"

Width="150px" runat="server" Text="Local Tax Authority"></asp:Label>

<telerik:RadComboBox runat="server" ID="rdcmbresidentLocalTaxAuthority" CssClass="ComboBox"

AutoPostBack="true" OnSelectedIndexChanged="rdcmbresidentLocalTaxAuthority_SelectedIndexChanged"

Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdresLocaltaxauthority" InitialValue="--select--"

runat="server" ErrorMessage="Select Tax Authority" ControlToValidate="rdcmbresidentLocalTaxAuthority"

ValidationGroup="vgResident" CssClass="error"></asp:RequiredFieldValidator>

</li>

</asp:Panel>

<asp:Panel ID="pnlresSchoolDistrict" runat="server" Visible="false">

<li>

<asp:Label ID="lblresSchoolDistrict" Width="150px" AssociatedControlID="rdcmdresSchoolDistrict"

runat="server" Text="School District"></asp:Label>

<telerik:RadComboBox runat="server" ID="rdcmdresSchoolDistrict" CssClass="ComboBox"

AutoPostBack="false" Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdresSchooldistrict" InitialValue="--select--" runat="server"

ErrorMessage="Select school district" ControlToValidate="rdcmdresSchoolDistrict"

ValidationGroup="vgResident" CssClass="error"></asp:RequiredFieldValidator>

</li>

</asp:Panel>

<li>

<asp:Label ID="lblWorkSame" AssociatedControlID="chkSame" runat="server" Width="150px"

Text="Work is same as Resident"></asp:Label>

<asp:CheckBox ID="chkSame" runat="server" /></li>

</ul>

<br />

<table style="margin-left: 50px;">

<tr>

<td>

<telerik:RadButton ID="rdbtnResidenceBack" OnClick="rdbtnResidenceBack_Click" runat="server" Text="Back" ValidationGroup="vgResident">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnResidenceCancel" OnClick="rdbtnResidenceCancel_Click" runat="server" Text="Cancel">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnResidenceSaveExit" OnClick="rdbtnResidenceSaveExit_Click" runat="server" Text="Save & Exit">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnResidenceSaveNext" runat="server" Text="Save & Next" OnClick="rdbtnResidenceSaveNext_Click"

ValidationGroup="vgResident">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnResidenceNext" runat="server" Text="Next" OnClick="rdbtnResidenceNext_Click">

</telerik:RadButton>

<br />

</td>

</tr>

</table>

<br />

</div>

</ItemTemplate>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelBar>

</telerik:RadPageView>

<telerik:RadPageView ID="rdpgWork" runat="server">

<telerik:RadPanelBar runat="server" ID="rdpbWork" ExpandMode="FullExpandedItem" Skin="Vista"

EnableEmbeddedSkins="false" Width="550px">

<Items>

<telerik:RadPanelItem Expanded="true" Text="Work Location" runat="server" Selected="true">

<Items>

<telerik:RadPanelItem Value="Work" runat="server">

<ItemTemplate>

<div class="text" style="background-color: #edf9fe">

<ul class="formList" id="residenceInfo">

<li>

<asp:Label ID="lblwrkTaxAutority" AssociatedControlID="rdwrkcmbTaxAuthority" Width="150px"

runat="server" Text="Tax Authority"></asp:Label>

<telerik:RadComboBox runat="server" ID="rdwrkcmbTaxAuthority" CssClass="ComboBox"

AutoPostBack="true" Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdwrkTaxAuthority" runat="server" ErrorMessage="Select Tax Authority"

ControlToValidate="rdwrkcmbTaxAuthority" InitialValue="--select-" ValidationGroup="vgWork"

CssClass="error"></asp:RequiredFieldValidator>

</li>

<li>

<asp:Label ID="lblwrkCountry" AssociatedControlID="rdwrkcmbCountry" Width="150px"

runat="server" Text="Country"></asp:Label>

<telerik:RadComboBox runat="server" ID="rdwrkcmbCountry" CssClass="ComboBox" AutoPostBack="false"

Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdwrkCountry" InitialValue="--select-" runat="server"

ErrorMessage="Select Country" ControlToValidate="rdwrkcmbCountry" ValidationGroup="vgWork"

CssClass="error"></asp:RequiredFieldValidator>

</li>

<li>

<asp:Label ID="lblwrkLocaltaxauthority" AssociatedControlID="rdwrkcmbLocalTaxAuthority"

Width="150px" runat="server" Text="Local Tax Authority"></asp:Label>

<telerik:RadComboBox runat="server" ID="rdwrkcmbLocalTaxAuthority" CssClass="ComboBox"

AutoPostBack="false" Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdwrkLocaltaxauthority" InitialValue="--select-"

runat="server" ErrorMessage="Select Tax Authority" ControlToValidate="rdwrkcmbLocalTaxAuthority"

ValidationGroup="vgWork" CssClass="error"></asp:RequiredFieldValidator>

</li>

<li>

<asp:Label ID="lblwrkSchoolDistrict" AssociatedControlID="rdcmdwrkSchoolDistrict"

Width="150px" runat="server" Text="School District"></asp:Label>

<telerik:RadComboBox runat="server" ID="rdcmdwrkSchoolDistrict" CssClass="ComboBox"

AutoPostBack="false" Width="200px">

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="rqrdwrkSchooldistrict" runat="server" ErrorMessage="Select school district"

ControlToValidate="rdcmdwrkSchoolDistrict" InitialValue="--select-" ValidationGroup="vgWork"

CssClass="error"></asp:RequiredFieldValidator>

</li>

</ul>

<br />

<table style="margin-left: 50px;">

<tr>

<td>

<telerik:RadButton ID="rdbtnworkBack" runat="server" Text="Back" ValidationGroup="vgWork">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnworkCancel" runat="server" Text="Cancel">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnworkSaveExit" runat="server" Text="Save & Exit">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnworkSaveNext" runat="server" Text="Save & Next">

</telerik:RadButton>

<telerik:RadButton ID="rdbtnworkNext" runat="server" Text="Next">

</telerik:RadButton>

<br />

</td>

</tr>

</table>

<br />

</div>

</ItemTemplate>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelBar>

</telerik:RadPageView>

</telerik:RadMultiPage>

Initially first rdpgResident will be in active state, now if i click on a button I would like to show rdpgWork in active state, I am getting the required but the rquired pageview was not high lighted.

As per the attached images First.png shows the default scenario, when i click on Save & next button I would like to do as per Second.png Image

5 Answers, 1 is accepted

answered on 07 Jun 2012, 02:58 PM

Hello Dorababu,

I tested your code and I am not able to get the behavior that you describe. Once I click a tab of the RadTabStrip control the corresponding page loads as expected. I would also suggest that you use either the SingleExpandedItem or the MultipleExpandedItems expandMode of the RadPanelBar control (that is in case you have not explicitly specify the height of the PanelItems). Please refer to this video that demonstrates the behavior that I get.

All the best,
Kate
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.

Accepted