Setting Html.IsActive based on View, Controller, and Parameter - MVC5, Bootstrap and Knockout

Question

I have a navigation panel that will lead to the same view populated with different values, depending on the id of the measure being transmitted.

        <div class="navbar-default sidebar" role="navigation">
            <div class="sidebar-nav navbar-collapse-custom">
                <ul class="nav nav-pills nav-stacked" id="side-menu">
                    <li class="@Html.IsActive("Home", "Index")">
                        @Html.ActionLink("Dashboard", "Index", "Home")
                    </li>
                    <li data-id="5" class="@Html.IsActive("Dashboard", "Measure")">
                        @Html.ActionLink("Timeliness", "Measure", "Dashboard", new {id="5"}, null)
                    </li>
                </ul>
            </div>
            <!-- /.sidebar-collapse -->
        </div>

Can I mark the selected item as active by using some derivative of "@Html.IsActive("Dashboard", "Measure" )"?

Do I need to use custom coding here?

Thanks!

Answer 1

I have been caught out by this before but remember that there is no connection between the server side ASP.Net mvc HTML helpers and the client side knockout view-models. You will need to create a knockout view-model on the client side to represent the active menu-item.