ASP.NET MVC Html.ActionLink在Bootstrap Select中不起作用

Question

我想為頁面的本地化選擇創建一個下拉列表。 但是，如果我嘗試使用<ul>標簽執行此操作，則Html.ActionLink幫助程序會使用以下語言代碼創建真正的鏈接

 @{
    var routeValues = this.ViewContext.RouteData.Values;
    var controller = routeValues["controller"] as string;
    var action = routeValues["action"] as string;
  }

 <ul>
    <li>
        @Html.ActionLink("TR", @action, @controller, new { culture = "tr" }, new { rel = "alternate", hreflang = "tr" })
    </li>
    <li>
        @Html.ActionLink("EN", @action, @controller, new { culture = "en" }, new { rel = "alternate", hreflang = "en" })
    </li>
</ul>

但是，如果我想在Bootstrap選擇控件中執行此操作，它將僅在其中顯示文本，而不會轉到我的url。

<select class="bs-select form-control" data-width="auto" id="js-data-example-ajax" name="js-data-example-ajax">
    <option>@Html.ActionLink("TR", @action, @controller, new {culture = "tr"}, new {rel = "alternate", hreflang = "tr"})</option>
    <option>@Html.ActionLink("EN", @action, @controller, new { culture = "en" }, new { rel = "alternate", hreflang = "en" })</option>
</select>

Answer 1

我已經在我的項目中完成了同樣的事情，請參考以下代碼：

我已經使用JavaScript完成此操作。

我的.cshtml代碼：

@Html.DropDownList(
    "url",
    new SelectList(new[]
    {
        new SelectListItem { Text = "About", Value = Url.Action("About", "Home") },
        new SelectListItem { Text = "MyPage", Value = Url.Action("Index", "Home") },
        new SelectListItem { Text = "APage", Value = Url.Action("AnyPage", "Home") },
    }, "Value", "Text"),
    "-- Pick an URL ---",
    new { id = "urlddl" }
)

我的JQuery代碼：

$(function() {
    $('#urlddl').change(function() {
        var url = $(this).val();
        if (url != null && url != '') {
            window.location.href = url;
        }
    });
});

使用jQuery，您可以訂閱此下拉列表的change事件並導航到相應的URL。

希望它能解決您的問題。

謝謝

Answer 2

你還有其他這樣的選擇

<option data-url="@Url.Action(@action, @controller)">
 TR
</option>

您在jquery中的下拉更改事件看起來像

$('#js-data-example-ajax').on('change', function() {
        var yourUrl = $('#js-data-example-ajax').find(":selected").data('url');
        document.location = yourUrl ;
    });