Selecting tab on page load in AngularJS

2 posts, 0 answers
  1. Jason
    Jason avatar
    22 posts
    Member since:
    Sep 2007

    Posted 30 Aug Link to this post

    I have a tab strip in AngularJS where I am saving the user's last viewed tab and then trying to programmatically select that tab when they return to the page using ng-class and a scoped variable. This worked in a previous version of kendo UI, but I recently upgraded to the latest version and it no longer works. Here is how it is setup:

     

     <div kendo-tab-strip="tabStrip" k-content-urls="[null, null]">
            <ul>
                <li ng-class="selectedTab == 'Surveys' ? 'k-state-active' : ''" ng-click="changeSelectedTab('Surveys')">Surveys</li>
                <li ng-class="selectedTab == 'Assigned Surveys' ? 'k-state-active' : ''" ng-click="changeSelectedTab('Assigned Surveys')" >Assigned Surveys</li>          
            </ul>

         <div>Tab1</div>

         <div>Tab2</div>

    </div>

     

    The tab will show that it is selected, but the div content does not display. Any suggestions on an possible workaround?

     

     

  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 01 Sep Link to this post

    Hi,

    You can use the kendoWidgetCreated event and select the needed tab. Here is some documentation:

    http://docs.telerik.com/kendo-ui/AngularJS/global-events#upon-widget-creation-kendowidgetcreated

    Regards,
    Kiril Nikolov
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
Back to Top