How do I create multi-level nav bar using TwitterBootstrapMVC

Question

I have the following nav bar defined in ASP.Net MVC 5.1 using TwitterBootstrapMVC3:

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            @Html.ActionLink("Inergy Systems", "Index", "Home", null, new { @class = "navbar-brand" })
        </div>
        <div class="navbar-collapse collapse">
            @using (var nav = Html.Bootstrap().Begin(new Nav().Style(NavType.NavBar)))
                {
                    @nav.Link("<span class='icon fa fa-home'></span> Home", "../home/index")
                    @nav.Link("<span class='icon fa fa-info'></span> About", "../home/about")
                    @nav.Link("<span class='icon fa fa-envelope'></span> Contact", "../home/contact")
                    using (var sm = nav.BeginDropDown(new DropDown("<span class='icon fa fa-dashboard'></span> Smart Views")))
                    {
                        @sm.Link("<span class='icon fa fa-globe'></span> 
                        @sm.Link("<span class='icon fa fa-building-o'></span> Location Dashboard", "#").Id("locationDashboardNav").Class("portalNav")
                        @sm.Link("<span class='icon fa fa-desktop'></span> Device Dashboard", "#").Id("deviceDashboardNav").Class("portalNav")
                        @sm.Link("<span class='icon fa fa-signal'></span> Latest Data", "#").Id("latestNav").Class("portalNav")
                        @sm.Link("<span class='icon fa fa-bar-chart-o'></span> Quick Charts", "#").Id("quickChartsNav").Class("portalNav")
                        @sm.Link("<span class='icon fa fa-plus-square-o'></span> Switch Control", "#").Id("switchControlNav").Class("portalNav")
                        @sm.Link("<span class='icon fa fa-th'></span> Analysis", "#").Id("analysisStandardNav").Class("portalNav")
                        @sm.Link("<span class='icon fa fa-th'></span> Advanced Analysis", "#").Id("analysisAdvancedNav").Class("portalNav")
                        @sm.Link("<span class='icon fa fa-usd'></span> Billing", "#").Id("billingNav").Class("portalNav")
                        @sm.Divider()

                        using (var dm = nav.BeginDropDown(new DropDown("<span class='icon fa fa-archive'></span> Data Management")))
                        {
                            @dm.Link("<span class='icon fa fa-group'></span> Group Management", "").Id("groupManagementNav").Class("portalNav")
                            @dm.Link("<span class='icon fa fa-user'></span> User Management", "").Id("userManagementNav").Class("portalNav")
                            @dm.Link("<span class='icon fa fa-home'></span> Location Management", "").Id("locationManagementNav").Class("portalNav")
                            @dm.Link("<span class='icon fa fa-home'></span> Device Management", "").Id("deviceManagementNav").Class("portalNav")
                            @dm.Link("<span class='icon fa fa-home'></span> Switch Management", "").Id("switchManagementNav").Class("portalNav")
                        }
                    }    
                }
                @Html.Partial("_LoginPartial")
            </div>
        </div>
    </div>

The first level dropdown (sm) displays fine, but the second level drop down (dm), after the divider, is not displaying. What am I doing wrong?

---

EDIT

Perhaps sub menus no longer being supports in Boostrap 3 (Bootstrap 3 dropdown sub menu missing) is the problem.