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

Avoid a tabstrip to be active, or make one active

2 Answers 42 Views
TabStrip (Mobile)
This is a migrated thread and some comments may be shown as answers.
Chris @ Willows Consulting Ltd.
Top achievements
Rank 1
Chris @ Willows Consulting Ltd. asked on 29 Oct 2013, 09:44 AM
Helly Guys,


I have two tabstrip, but I want the first one to always appear as active. Here is the excerpt of the code below (that doesn't work).

    <!-- FOOTER -->
    <div data-role="footer" data-align="left">
        <div data-role="tabstrip" data-align="left">
            <a href="#results" data-icon="globe" data-transition="slide:top" id="resultstab"><div id="results_count_display" style="color:white" class="km-text">Loading..</div></a>
            <a href="#filter" data-icon="settings" data-transition="slide:top" id="settingstab"><div class="km-text" style="color:white">Filter</div></a>
        </div>
    </div
    <!-- END OF: FOOTER -->
<script>
$('#settingstab').bind('click', function () { $('#settingstab').removeClass('km-state-active');$('#resultstab').addClass('km-state-active'); });   
</script>
</div>
I want that when "settingstab" is clicked on: the "resultstab" flips back to active.


Thanks.

2 Answers, 1 is accepted

Sort by
0
Accepted
Kiril Nikolov
Telerik team
answered on 29 Oct 2013, 02:23 PM
Hi Sean,

Such functionality is not supported out of the box. However you can use the TabStrip's select event and change the classes of the items inside. Please check the following example showing a possible implementation:

http://jsbin.com/ATADOWu/3/edit
 
Regards,
Kiril Nikolov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Chris @ Willows Consulting Ltd.
Top achievements
Rank 1
answered on 30 Oct 2013, 02:22 PM
Thanks a lot Kiril, it's working fine now :).
Tags
TabStrip (Mobile)
Asked by
Chris @ Willows Consulting Ltd.
Top achievements
Rank 1
Answers by
Kiril Nikolov
Telerik team
Chris @ Willows Consulting Ltd.
Top achievements
Rank 1
Share this question
or