templating toggle between tabs - Templates, (partial) views and macros

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Simeon Ostberg 123 posts 389 karma points

Mar 27, 2018 @ 13:48

Templating: Toggle between tabs

Templates, (partial) views and macros

Umbraco 7

Hi everyone,

I'm working on a template to adapt it to Umbraco. I would like to toggle between three active days (it's about a congress schedule).

This is the code in the template:

                @foreach (var date in dates)
                    {
                        <!-- Navigation by day start -->
                            <ul class="nav nav-schedule">
                                <li class="active"><a href="#schedule2_day1" data-toggle="tab"><h5 class="highlight">@date.scheduleday</h5><p class="text-alt">@date.scheduledate</p></a></li>
                                <li><a href="#schedule2_day2" data-toggle="tab"><h5 class="highlight">Day 2</h5><p class="text-alt">09/10/2016</p></a></li>
                                <li><a href="#schedule2_day3" data-toggle="tab"><h5 class="highlight">Day 3</h5><p class="text-alt">10/10/2016</p></a></li>
                            </ul>
                    }

I have the data fields @date.scheduleday and @date.scheduledate. I have 3 days and dates.

Unfortunately I don't know, how to get just one line of tabs, with the first one being preselected and the other 2 selectable.

Does anyone know, how to do this?

Thanks in advance! Simeon

Copy Link

Nigel Wilson 944 posts 2076 karma points

Mar 28, 2018 @ 18:14
1
Hi Simeon

I think you need to do something along the lines of
```

<ul class="nav nav-schedule">
    @foreach (var date in dates)
    {
        string activeTab = date.IsFirst() ? "active" : string.Empty;
        <li class="@activeTab">##your date code here</li>
    }   
</ul>
```
I haven't added the exact code for the list items, but hopefully this will get you on the way.

Cheers

Nigel
Copy Link
Simeon Ostberg 123 posts 389 karma points

Apr 11, 2018 @ 13:11

0

Hi Nigel,

Thanks a lot, and please excuse my late reply!

I will try this...

Best, Simeon

Copy Link
is working on a reply...

Please Sign in or register to post replies