Ok, I've gone through the demo's that were installed.. I've gone through the help I could find on the site and I used responses from my last topic..

But I can't get this thing to work. I have a multi-level(sub-grouped) tab list. The top list is nothing but an identifier, when it is selected it is to default to the first pageView in its sub-group. No matter which top-level item you choose it should select the first sub-group tab and display the appropriate pageview.. but it doesn't. Here is the entire code I'm hoping someone can plug it in and see if they get the same problem I do - it doesn't work.. I step through the code and it hits the javascript just fine and executes.. but the page doesn't give the intended results..

ASPX PAGE

<eo:TabStrip ID="TabStrip1" runat="server" ControlSkinID="None" MultiPageID="mp_Main" ClientSideOnItemClick="tab_click_handler">
<LookItems>
<eo:TabItem ItemID="_TopGroup">
<SubGroup OverlapDepth="8"
Style-CssText="background-image:url(00010220);background-repeat:repeat-x;cursor:hand;font-family:tahoma;font-size:8pt;">
</SubGroup>
</eo:TabItem>
<eo:TabItem Image-BackgroundRepeat="RepeatX" Image-Mode="TextBackground"
Image-SelectedUrl="00010225" Image-Url="00010222" ItemID="_TopLevelItem"
LeftIcon-SelectedUrl="00010224" LeftIcon-Url="00010221"
NormalStyle-CssText="color: #606060" RightIcon-SelectedUrl="00010226"
RightIcon-Url="00010223"
SelectedStyle-CssText="color:#2f4761;font-weight:bold;">
<SubGroup ItemSpacing="5"
Style-CssText="background-image:url(00010220);background-position-y:bottom;background-repeat:repeat-x;cursor:hand;font-family:tahoma;font-size:8pt;padding-bottom:4px;padding-left:5px;padding-right:5px;padding-top:4px;">
</SubGroup>
</eo:TabItem>
<eo:TabItem HoverStyle-CssText="color:#2f4761;text-decoration:underline;"
ItemID="_Default" NormalStyle-CssText="color: #606060; text-decoration: none"
SelectedStyle-CssText="color:#2f4761;font-weight:bold;">
<SubGroup ItemSpacing="5"
Style-CssText="background-image:url(00010220);background-position-y:bottom;background-repeat:repeat-x;cursor:hand;font-family:tahoma;font-size:8pt;padding-bottom:4px;padding-left:5px;padding-right:5px;padding-top:4px;">
</SubGroup>
</eo:TabItem>
</LookItems>
<TopGroup>
<Items>
<eo:TabItem Text-Html="Location Support">
<SubGroup CausesValidation="False" RaisesServerEvent="False">
<Items>
<eo:TabItem Text-Html="Types" PageViewID="pv_LocTypes" Checked="true">
</eo:TabItem>
<eo:TabItem Text-Html="Sub-Types" PageViewID="pv_LocSubTypes">
</eo:TabItem>
<eo:TabItem Text-Html="Degree Types" PageViewID="pv_LocDegreeTypes">
</eo:TabItem>
<eo:TabItem Text-Html="Clinic Types" PageViewID="pv_LocClinicTypes">
</eo:TabItem>
<eo:TabItem Text-Html="Employee Types" PageViewID="pv_LocEmployeeTypes">
</eo:TabItem>
</Items>
</SubGroup>
</eo:TabItem>
<eo:TabItem Text-Html="Rep Support" PageViewID="">
<SubGroup>
<Items>
<eo:TabItem Text-Html="Region Assignments" PageViewID="pv_RepRegionAssign">
</eo:TabItem>
</Items>
</SubGroup>
</eo:TabItem>
<eo:TabItem Text-Html="Contact Support" PageViewID="">
<SubGroup>
<Items>
<eo:TabItem Text-Html="Contact Types" PageViewID="pv_ConContactTypes">
</eo:TabItem>
<eo:TabItem Text-Html="Degree Types" PageViewID="pv_ConDegreeTypes">
</eo:TabItem>
<eo:TabItem Text-Html="Specialty Types" PageViewID="pv_ConSpecialtyTypes">
</eo:TabItem>
<eo:TabItem Text-Html="Certification Types" PageViewID="pv_ConCertTypes">
</eo:TabItem>
</Items>
</SubGroup>
</eo:TabItem>
<eo:TabItem Text-Html="Visit Support" PageViewID="">
<SubGroup>
<Items>
<eo:TabItem Text-Html="Visit Types" PageViewID="pv_VisVisitTypes">
</eo:TabItem>
</Items>
</SubGroup>
</eo:TabItem>
<eo:TabItem Text-Html="Vet Pillar" PageViewID="">
<SubGroup>
<Items>
<eo:TabItem Text-Html="Directors" PageViewID="pv_VetDirector">
</eo:TabItem>
<eo:TabItem Text-Html="Service Groups" PageViewID="pv_VetServiceGroups">
</eo:TabItem>
<eo:TabItem Text-Html="Regions" PageViewID="pv_VetRegion">
</eo:TabItem>
<eo:TabItem Text-Html="Region Managers" PageViewID="pv_VetRegionManagers">
</eo:TabItem>
<eo:TabItem Text-Html="District Managers" PageViewID="pv_VetDistrictManagers">
</eo:TabItem>
<eo:TabItem Text-Html="Representatives" PageViewID="pv_VetReps">
</eo:TabItem>
</Items>
</SubGroup>
</eo:TabItem>
</Items>
</TopGroup>
</eo:TabStrip>
<eo:MultiPage ID="mp_Main" runat="server" Height="180px" Width="100%" style="border-left: #7f9db9 1px solid; border-right: #7f9db9 1px solid; border-bottom: #7f9db9 1px solid">
<eo:PageView ID="pv_LocTypes" runat="server" Width="100%">
<asp:Label ID="Label3" runat="server" Text="PV Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_LocSubTypes" runat="server" Width="100%">
<asp:Label ID="Label1" runat="server" Text="PV Sub-Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_LocDegreeTypes" runat="server" Width="100%">
<asp:Label ID="Label2" runat="server" Text="PV Degree Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_LocClinicTypes" runat="server" Width="100%">
<asp:Label ID="Label4" runat="server" Text="PV Clinic Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_LocEmployeeTypes" runat="server" Width="100%">
<asp:Label ID="Label5" runat="server" Text="PV Emmployee Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_RepRegionAssign" runat="server" Width="100%">
<asp:Label ID="Label6" runat="server" Text="PV Region Assignments"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_ConContactTypes" runat="server" Width="100%">
<asp:Label ID="Label7" runat="server" Text="PV Contact Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_ConDegreeTypes" runat="server" Width="100%">
<asp:Label ID="Label8" runat="server" Text="PV Degree Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_ConSpecialtyTypes" runat="server" Width="100%">
<asp:Label ID="Label9" runat="server" Text="PV Specialty Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_ConCertTypes" runat="server" Width="100%">
<asp:Label ID="Label10" runat="server" Text="PV Certification Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_VisVisitTypes" runat="server" Width="100%">
<asp:Label ID="Label11" runat="server" Text="PV Visit Types"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_VetDirector" runat="server" Width="100%">
<asp:Label ID="Label12" runat="server" Text="PV Vet Director"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_VetServiceGroups" runat="server" Width="100%">
<asp:Label ID="Label13" runat="server" Text="PV Vet Service Groups"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_VetRegion" runat="server" Width="100%">
<asp:Label ID="Label14" runat="server" Text="PV Vet Regions"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_VetRegionManagers" runat="server" Width="100%">
<asp:Label ID="Label15" runat="server" Text="PV Vet Region Managers"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_VetDistrictManagers" runat="server" Width="100%">
<asp:Label ID="Label16" runat="server" Text="PV Vet District Managers"></asp:Label>
</eo:PageView>
<eo:PageView ID="pv_VetReps" runat="server" Width="100%">
<asp:Label ID="Label17" runat="server" Text="PV Vet Representatives"></asp:Label>
</eo:PageView>
</eo:MultiPage>

JAVASCRIPT FUNCTION - I've used page id and index and nothing seems to work

function tab_click_handler(e, info)
{
/*
window.alert("Menu item '" +
info.getItem().getText() + "' clicked.");
*/
//Get the tab item
var item = info.getItem();
var multiPage = eo_GetObject("mp_Main");

if (item.getLevel() == 0)
{
switch (item.getIndex())
{
case 0:
multiPage.selectPageById("pv_LocTypes");
break;
case 1:
multiPage.selectPageById("pv_RepRegionAssign");
//multiPage.selectPageByIndex(5);
break;
case 2:
multiPage.selectPageById("pv_ConContactTypes");
//multiPage.selectPageByIndex(6);
break;
case 3:
multiPage.selectPageById("pv_VisVisitTypes");
//multiPage.selectPageByIndex(10);
break;
case 4:
multiPage.selectPageById("pv_VetDirector");
//multiPage.selectPageByIndex(11);
break;
default:
break;
}

}
}

That doesn't make sense. There is only 1 MultiPage with many PageViews, I don't quite understand what you mean by clearing out the mutiPage ID on the tabstrip.. how will it know what multiPage to use much less what Page View?

Hi,

Usually you would set the TabStrip's MultiPageID so that the TabStrip knows which multi-page it supposes to switch, which triggers the default tab switching logics. However in your case because the default logic does not work for you, so you chose to go with the advanced option to take care of the tab switching by yourself. In this case all you wanted is to have the TabStrip calls your tab_click_handler function. Once it calls your function, you can do whatever inside your function. Because you do not want the TabStrip to do the switching (because your JavaScript is doing it), so you no longer need to set the TabStrip's MultiPageID property.

Hope this clears up.

Thanks!

Yes. Most of the time it's all or nothing. There are other options, but it's probably easier to stick with getLevel and getIndex if you do not wish to get into the API details. If you are willing to get into the details, then yes it's possible for you override part of the default behavior. You can check "Event Cancellation" on this page:

http://doc.essentialobjects.com/library/1/menucommon/handlingevent/client_event.aspx

Thanks