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

Multipage issue with vertical tabs

2 Answers 87 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Steven
Top achievements
Rank 1
Steven asked on 05 Mar 2009, 09:17 PM
I cannot get my RadMultiPage to line up with a VerticalLeft tabstrip. It shows up below the tabstrip instead of along side of it.  If I change it to VerticalRight it works fine and shows up along side of the tab strip.  Also, do nested tabs always show up under the parent tab? If so, how can change the size of the nested tabs so they do not look like the parent tab?

Any help would be greatly appreciated!

Here is my code:

<radM:RadTabStrip ID="tabstripBrandingOptions" runat="server" Orientation="VerticalLeft" 
        SelectedIndex="0" CausesValidation="False" MultiPageID="MultiPageBranding" Skin="Vista"
        <Tabs> 
            <radM:RadTab Text="Add Provider"
            </radM:RadTab> 
            <radM:RadTab Text="Linked Enterprises" runat="server"
            </radM:RadTab> 
            <radM:RadTab Text="Netspoke Pro Options" runat="server"
            </radM:RadTab> 
            <radM:RadTab Text="Branding Options" runat="server"
                <Tabs> 
                    <radM:RadTab Text="Web Conf. Logo"
                    </radM:RadTab> 
                    <radM:RadTab Text="Hub Logo"
                    </radM:RadTab> 
                    <radM:RadTab Text="Marketing Links"
                    </radM:RadTab> 
                    <radM:RadTab Text="Logo Text"
                    </radM:RadTab> 
                </Tabs> 
            </radM:RadTab> 
        </Tabs> 
    </radM:RadTabStrip> 
    <radM:RadMultiPage ID="MultiPageBranding" runat="server" SelectedIndex="0" CssClass="multiPage"
        <radM:RadPageView runat="server"
            <div class="yui-gd"
                <div class="yui-g first leftDiv"
                    <asp:Localize ID="locProviderName" runat="server" Text="Provider Name:" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locProviderType" runat="server" Text="Provider Type:" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locHubGroupDomain" runat="server" Text="Hub Group Domain:" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locDefaultMeetingServer" Text="Default Meeting Server:" runat="server" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locSecureDefaultMeetingServer" Text="Secure Default Meeting Server:" 
                        runat="server" />&nbsp;<span class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locAppShareHost" Text="App Share Host:" runat="server" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locCustomerHomePage" runat="server" Text="Customer Home Page:" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locDefaultConferenceTitle" runat="server" Text="Default Conference Title:" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locDefaultModeratorEmailSubject" runat="server" Text="Default Moderator Email Subject:" />&nbsp;<span 
                        class="required">*</span> 
                    <br /> 
                    <asp:Localize ID="locDefaultAttendeeEmailSubject" runat="server" Text="Default Attendee Email Subject:" />&nbsp;<span 
                        class="required">*</span> 
                </div> 
                <div class="yui-g rightDiv"
                    <asp:TextBox runat="server" ID="txtProviderName" Width="214px" /> 
                    <asp:RequiredFieldValidator ID="rvProviderName" runat="server" ControlToValidate="txtProviderName" 
                        Display="Dynamic" ErrorMessage="Provider Name is required" SetFocusOnError="True"></asp:RequiredFieldValidator> 
                    &nbsp; 
                    <asp:RegularExpressionValidator ID="revProviderName" runat="server" ErrorMessage="Only alphanumeric characters and spaces allowed." 
                        ControlToValidate="txtProviderName" Display="Dynamic" SetFocusOnError="True" 
                        ValidationExpression="^[0-9a-zA-Z ]+$"></asp:RegularExpressionValidator> 
                    <br /> 
                    <asp:DropDownList ID="ddlProviderType" runat="server" /> 
                    <br /> 
                    <asp:TextBox ID="txtHubGroupDomain" runat="server" onchange="SetText()" Width="214px" /> 
                    <asp:RequiredFieldValidator ID="rvHubGrpDomain" runat="server" ControlToValidate="txtHubGroupDomain" 
                        Display="Dynamic" ErrorMessage="Hub Group Domain is required" SetFocusOnError="True"></asp:RequiredFieldValidator> 
                    &nbsp; 
                    <asp:RegularExpressionValidator ID="revHubGroupDomain" runat="server" ErrorMessage="Not a valid domain name." 
                        ControlToValidate="txtHubGroupDomain" Display="Dynamic" SetFocusOnError="True" 
                        ValidationExpression="^([a-zA-Z0-9]([a-zA-Z0-9\-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,6}$"></asp:RegularExpressionValidator> 
                    <br /> 
                    <asp:TextBox ID="txtDefualtMeetingServer" runat="server" Width="214px" /> 
                    <input id="inpMeetingServerAppend" readonly="readonly" runat="server" type="text" /> 
                    <asp:RequiredFieldValidator ID="rvDefMtngServer" runat="server" ControlToValidate="txtDefualtMeetingServer" 
                        Display="Dynamic" ErrorMessage="Default Meeting Server is required" SetFocusOnError="True"></asp:RequiredFieldValidator> 
                    &nbsp; 
                    <asp:RegularExpressionValidator ID="revdefMeetingServer" runat="server" ErrorMessage="Only numbers, letters, or dashes allowed." 
                        ControlToValidate="txtDefualtMeetingServer" Display="Dynamic" SetFocusOnError="True" 
                        ValidationExpression="(^[a-zA-Z0-9][a-zA-Z0-9-]*[a-zA-Z0-9]$)"></asp:RegularExpressionValidator> 
                    <br /> 
                    <asp:TextBox ID="txtSecureDefaultMeetingServer" runat="server" Width="214px" /> 
                    <input id="inpSecureMeetingServerAppend" readonly="readonly" runat="server" type="text" /> 
                    <asp:RequiredFieldValidator ID="rvSecDefMtngServer" runat="server" ControlToValidate="txtSecureDefaultMeetingServer" 
                        Display="Dynamic" ErrorMessage="Secure Default Meeting Server is required" SetFocusOnError="True"></asp:RequiredFieldValidator> 
                    &nbsp; 
                    <asp:RegularExpressionValidator ID="revSecDefMeetingServer" runat="server" ErrorMessage="Only numbers, letters, or dashes allowed." 
                        ControlToValidate="txtSecureDefaultMeetingServer" Display="Dynamic" SetFocusOnError="True" 
                        ValidationExpression="(^[a-zA-Z0-9][a-zA-Z0-9-]*[a-zA-Z0-9]$)"></asp:RegularExpressionValidator> 
                    <br /> 
                    <asp:TextBox ID="txtAppShareHost" runat="server" Width="214px" /> 
                    <input id="inpAppShareHostAppend" readonly="readonly" runat="server" type="text" /> 
                    <asp:RequiredFieldValidator ID="rvAppShareHost" runat="server" ControlToValidate="txtAppShareHost" 
                        Display="Dynamic" ErrorMessage="App Share Host is required" SetFocusOnError="True"></asp:RequiredFieldValidator> 
                    <asp:RegularExpressionValidator ID="revAppShareHost" runat="server" ErrorMessage="Only numbers, letters, or dashes allowed." 
                        ControlToValidate="txtAppShareHost" Display="Dynamic" SetFocusOnError="True" 
                        ValidationExpression="(^[a-zA-Z0-9][a-zA-Z0-9-]*[a-zA-Z0-9]$)"></asp:RegularExpressionValidator> 
                    <br /> 
                    <asp:TextBox ID="txtCustomerHomePage" runat="server" Width="214px" /> 
                    <asp:RequiredFieldValidator ID="rvCustomerHomePage" runat="server" ControlToValidate="txtCustomerHomePage" 
                        Display="Dynamic" ErrorMessage="Customer Home Page is required" SetFocusOnError="True"></asp:RequiredFieldValidator> 
                    &nbsp;<asp:RegularExpressionValidator ID="revHomePage" runat="server" ErrorMessage="Not a valid url." 
                        ControlToValidate="txtCustomerHomePage" Display="Dynamic" SetFocusOnError="True" 
                        ValidationExpression="http(s)?://([\w-]+\.)+[\w-]+(/[\w- ./?%&amp;=]*)?"></asp:RegularExpressionValidator> 
                    <br /> 
                    <asp:TextBox ID="txtDefaultConferenceTitle" runat="server" Width="214px" /> 
                    <asp:RequiredFieldValidator ID="rvDefaultConferenceTitle" runat="server" ControlToValidate="txtDefaultConferenceTitle" 
                        Display="Dynamic" ErrorMessage="Default Conference Title is required" SetFocusOnError="True"></asp:RequiredFieldValidator> 
                    <br /> 
                    <asp:TextBox ID="txtDefaultModeratorEmailSubject" runat="server" Width="214px" /> 
                    <asp:CheckBox ID="chkModeratorSameAsTitle" runat="server" Text="Same as title" /> 
                    <asp:CustomValidator ControlToValidate="txtDefaultModeratorEmailSubject" ID="valDefaultModeratorEmailSubject" 
                        runat="server" ErrorMessage="Default Moderator Email Subject is required" ValidateEmptyText="true" 
                        SetFocusOnError="true" Display="Dynamic" /> 
                    <br /> 
                    <asp:TextBox ID="txtDefaultAttendeeEmailSubject" runat="server" Width="214px" /> 
                    <asp:CheckBox ID="chkAttendeeSameAsTitle" runat="server" Text="Same as title" /> 
                    <asp:CustomValidator ControlToValidate="txtDefaultAttendeeEmailSubject" ID="valDefaultAttendeeEmailSubject" 
                        runat="server" ErrorMessage="Default Attendee Email Subject is required" ValidateEmptyText="true" 
                        SetFocusOnError="true" Display="Dynamic" /> 
                </div> 
            </div> 
        </radM:RadPageView> 
        <radM:RadPageView runat="server"
            <div id="doc3"
                <asp:UpdateProgress ID="UpdateProgressEnterprises" runat="server" AssociatedUpdatePanelID="updatePanelEnterprises" 
                    DisplayAfter="0"
                    <ProgressTemplate> 
                        <asp:Image ID="imgAjaxProgress" runat="server" ImageUrl="~/images/ajax-loader.gif" /> 
                    </ProgressTemplate> 
                </asp:UpdateProgress> 
                <asp:UpdatePanel ID="updatePanelEnterprises" runat="server"
                    <ContentTemplate> 
                        <div style="width: 900px;"
                            <table class="widetable"
                                <tr> 
                                    <td> 
                                        <strong> 
                                            <asp:Localize ID="Localize3" runat="server" Text="Enterprise Name:" /></strong
                                    </td> 
                                    <td> 
                                        <asp:TextBox ID="txtEnterpriseName" runat="server" Width="214px" /> 
                                    </td> 
                                </tr> 
                                <tr> 
                                    <td> 
                                        <strong> 
                                            <asp:Localize ID="Localize6" runat="server" Text="Enterprise Type:" /></strong
                                    </td> 
                                    <td align="left"
                                        <asp:DropDownList ID="ddlEnterpriseType" runat="server"
                                        </asp:DropDownList> 
                                    </td> 
                                </tr> 
                                <tr> 
                                    <td> 
                                    </td> 
                                    <td align="left"
                                        <asp:Button ID="btnSearchEnterprise" runat="server" CssClass="brandingButton" Text="Search" 
                                            OnClick="btnSearchEnterprise_Click" UseSubmitBehavior="False" CausesValidation="False" /> 
                                    </td> 
                                </tr> 
                                <tr> 
                                    <td> 
                                    </td> 
                                    <td> 
                                    </td> 
                                </tr> 
                            </table> 
                        </div> 
                        <div style="width: 900px;"
                            <table> 
                                <tr> 
                                    <td align="center"
                                        <strong> 
                                            <asp:Localize ID="locAvaiableEnterprises" runat="server" Text="Search Results" /> 
                                        </strong> 
                                    </td> 
                                    <td align="center"
                                    </td> 
                                    <td align="center"
                                        <strong> 
                                            <asp:Localize ID="locSelectedEnterprises" runat="server" Text="Selected Enterprises" /> 
                                        </strong> 
                                    </td> 
                                </tr> 
                                <tr> 
                                    <td> 
                                        <asp:ListBox ID="lstSearchResults" runat="server" Rows="10" SelectionMode="Multiple" 
                                            Width="280px"></asp:ListBox> 
                                    </td> 
                                    <td align="center" valign="middle"
                                        <asp:Button ID="btnAddEnterprise" runat="server" CssClass="brandingButton" OnClick="btnAddEnterprise_Click" 
                                            Text="Add&gt;&gt;" UseSubmitBehavior="False" CausesValidation="False" /> 
                                    </td> 
                                    <td valign="middle"
                                        <asp:ListBox ID="lstSelectedEnterprises" runat="server" Rows="10" SelectionMode="Multiple" 
                                            Width="280px"></asp:ListBox> 
                                    </td> 
                                </tr> 
                                <tr> 
                                    <td align="center"
                                        <asp:Button ID="btnClearResults" runat="server" CausesValidation="False" CssClass="brandingButton" 
                                            OnClick="btnClearResults_Click" Text="Clear Search" UseSubmitBehavior="False" /> 
                                    </td> 
                                    <td> 
                                    </td> 
                                    <td align="center"
                                        <asp:Button ID="btnDeleteSelected" runat="server" CssClass="brandingButton" OnClick="btnDeleteSelected_Click" 
                                            Text="Delete Selected" UseSubmitBehavior="False" CausesValidation="False" /> 
                                    </td> 
                                </tr> 
                            </table> 
                        </div> 
                    </ContentTemplate> 
                    <Triggers> 
                        <asp:AsyncPostBackTrigger ControlID="btnSearchEnterprise" EventName="Click" /> 
                        <asp:AsyncPostBackTrigger ControlID="btnAddEnterprise" EventName="Click" /> 
                        <asp:AsyncPostBackTrigger ControlID="btnDeleteSelected" EventName="Click" /> 
                        <asp:AsyncPostBackTrigger ControlID="btnClearResults" EventName="Click" /> 
                    </Triggers> 
                </asp:UpdatePanel> 
            </div> 
        </radM:RadPageView> 
        <radM:RadPageView runat="server"
            <div class="yui-gb"
                <div class="yui-g first"
                    <strong> 
                        <asp:Localize ID="locScheduleOptions" runat="server" Text="Scheduling/Joining" /></strong><br /> 
                    <asp:CheckBox ID="chkRequirePasscodeChecked" runat="server" Text="Conference private by default" /><br /> 
                    <asp:CheckBox ID="chkJoinNoiseEnabled" runat="server" Text="Audio alert when someone joins" /><br /> 
                    <asp:CheckBox ID="chkCallMyPhoneEnabled" runat="server" Text="Enable call my phone feature" /><br /> 
                    <asp:CheckBox ID="chkPresentationsChecked" runat="server" Text="All uploaded presentations available" /><br /> 
                    <asp:CheckBox ID="chkPollingChecked" runat="server" Text="All uploaded polling questions available" /><br /> 
                    <asp:CheckBox ID="chkWebRecordingConfigEnabled" runat="server" Text="Web recording is modifiable in scheduling" /><br /> 
                    <asp:CheckBox ID="chkRecordAllWeb" runat="server" Text="Record all web conference events" /><br /> 
                </div> 
                <div class="yui-g"
                    <strong> 
                        <asp:Localize ID="locConferenceOptions" runat="server" Text="In Conference" /></strong><br /> 
                    <asp:CheckBox ID="chkQAEnabled" runat="server" Text="Enable Q&A" /><br /> 
                    <asp:CheckBox ID="chkWebRecordingEnabled" runat="server" Text="Enable web recording option" /><br /> 
                    <asp:CheckBox ID="chkChatEnabled" runat="server" Text="Enable chat" /><br /> 
                    <asp:CheckBox ID="chkBlockSharingEntireDesktop" runat="server" Text="Enable desktop sharing" /><br /> 
                    <asp:CheckBox ID="chkAppShareEnabled" runat="server" Text="Enable AppShare" /><br /> 
                    <asp:CheckBox ID="chkSharingVideoEnabled" runat="server" Text="Enable video" /><br /> 
                    <asp:CheckBox ID="chkSharedFilesEnabled" runat="server" Text="Enable file transfer" /><br /> 
                    <asp:CheckBox ID="chkPollingEnabled" runat="server" Text="Enable polling" /><br /> 
                    <asp:CheckBox ID="chkWhiteboardEnabled" runat="server" Text="Enable whiteboard" /><br /> 
                    <asp:CheckBox ID="chkPresentationsEnabled" runat="server" Text="Enable PowerPoint sharing" /><br /> 
                    <asp:CheckBox ID="chkHelpEnabled" runat="server" Text="Enable live help" /><br /> 
                </div> 
                <div class="yui-g"
                    <strong> 
                        <asp:Localize ID="locAppShareOptions" runat="server" Text="AppShare/Communication" /></strong><br /> 
                    <asp:CheckBox ID="chkAppShareMaskingEnabled" runat="server" Text="Hide pop-up windows when sharing" /><br /> 
                    <asp:CheckBox ID="chkGrantControlEnabled" runat="server" Text="Grant control to participants enabled" /><br /> 
                    <asp:CheckBox ID="chkSecure" runat="server" Text="SSL enabled for all conferences by default" /><br /> 
                    <asp:Label ID="lblAppShareColorDepth" runat="server" Text="Set default AppShare color level" /> 
                    <asp:DropDownList ID="ddlAppShareColorDepth" runat="server"
                        <asp:ListItem Text="Low" Value="8" /> 
                        <asp:ListItem Text="High" Value="16" /> 
                    </asp:DropDownList> 
                    <br /> 
                </div> 
            </div> 
        </radM:RadPageView> 
        <radM:RadPageView runat="server"
            <strong> 
                <asp:Localize ID="locWebLogoCurrent" runat="Server" Text="Web Conference Logo:" /> 
            </strong> 
            <asp:Image ID="imgConfLogo" runat="server" CssClass="previewImage" /><br /> 
            <br /> 
            <asp:Localize ID="Localize1" runat="server" Text="Select Conference Logo for upload:" /><br /> 
            <radM:RadUpload ID="RadUploadWebConfLogo" runat="server" InitialFileInputsCount="1" 
                ControlObjectsVisibility="None" MaxFileSize="262144000" MaxFileInputsCount="1" 
                OnValidatingFile="RadUpload_ValidatingFile" Width="100%" EnableFileInputSkinning="false" /> 
            <p> 
                <asp:Localize ID="Localize5" runat="Server" Text="<i><strong>Logo Requirements:</strong><br>&#8226; The file must be in <strong>.jpg or .gif</strong> format<br>&#8226; The image must not exceed <strong>150W x 38H</strong> px<br>&#8226; The file size must not exceed <strong>128</strong> kb</i>." /> 
            </p> 
            <asp:Button ID="btnWebConfLogoPreview" runat="server" Text="Preview" OnClick="btnWebConfLogoPreview_Click" 
                CssClass="brandingButton" UseSubmitBehavior="False" /> 
            <asp:HiddenField ID="hfWebConfLogo" runat="server" /> 
        </radM:RadPageView> 
        <radM:RadPageView runat="server"
            <strong> 
                <asp:Localize ID="locHubLogoCurrent" runat="Server" Text="Conferencing Hub Logo:" /> 
            </strong> 
            <asp:Image ID="imgHeaderLogo" runat="server" CssClass="previewImage" /><br /> 
            <br /> 
            <asp:Localize ID="Localize2" runat="Server" Text="Select Conferencing Hub Logo for upload:" /><br /> 
            <radM:RadUpload ID="RadUploadHeaderLogo" runat="server" InitialFileInputsCount="1" 
                ControlObjectsVisibility="None" MaxFileSize="262144000" MaxFileInputsCount="1" 
                OnValidatingFile="RadUpload_ValidatingFile" Width="100%" EnableFileInputSkinning="false" /> 
            <p> 
                <asp:Localize ID="Localize4" runat="Server" Text="<i><strong>Logo Requirements:</strong><br>&#8226; The file must be in <strong>.jpg or .gif</strong> format<br>&#8226; The image must not exceed <strong>150W x 60H</strong> px<br>&#8226; The file size must not exceed <strong>128</strong> kb</i>." /> 
            </p> 
            <asp:Button ID="btnHeaderLogoPreview" runat="server" Text="Preview" OnClick="btnHeaderLogoPreview_Click" 
                CssClass="brandingButton" UseSubmitBehavior="False" /> 
            <asp:HiddenField ID="hfHeaderLogo" runat="server" /> 
        </radM:RadPageView> 
        <radM:RadPageView runat="server"
            test 
        </radM:RadPageView> 
        <radM:RadPageView runat="server"
            test 
        </radM:RadPageView> 
    </radM:RadMultiPage> 

Here is my css:
.multiPage 
        { 
             
            
            border:1px solid #94A7B5
            background-color:#F0F1EB
            padding:4px
            padding-left:5px
            width:775px
            margin-left:5px;                 
        } 
         
.leftDiv 
    float:left
    width:180px
    line-height:30px
    min-height:300px
    border:1px solid #94A7B5
     
 
 
.rightDiv 
{    
     
    line-height:32px
    min-height:300px
    border:1px solid #94A7B5
    width:350px
 
#doc3 
    border:1px solid #94A7B5
 

2 Answers, 1 is accepted

Sort by
0
Steven
Top achievements
Rank 1
answered on 06 Mar 2009, 04:28 PM
Can anyone at Telerik help me with this issue?
0
Paul
Telerik team
answered on 07 Mar 2009, 03:00 PM
Hello Steven,

Here's your modified tabstrip definition that works as expected.

<radM:RadTabStrip  
    ID="tabstripBrandingOptions"  
    runat="server"  
    Orientation="VerticalLeft" 
    SelectedIndex="0"  
    CausesValidation="False"  
    MultiPageID="MultiPageBranding"  
    Skin="Vista"  
    style="float:left"


Regards,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
TabStrip
Asked by
Steven
Top achievements
Rank 1
Answers by
Steven
Top achievements
Rank 1
Paul
Telerik team
Share this question
or