使用下拉列表中的MVC導航3

Question

嗨，我使用一個下拉列表，使用填充產品：

@Html.DropDownList("Product", new SelectList(Model.Products, "ProductUrl", "ProductName")) 

這是呈現爲：

<select id="Product" name="Product"> 
<option value="http://www.domain.co.uk/test?specs=5">produc1</option> 

<option value="http://www.domain.co.uk/test?specs=6">product2</option> 

<option value="http://www.domain.co.uk/test?specs=7">product3</option> 

</select> 

我想要做的是當系統應該導航到該產品的選項值，例如，如果客戶從下拉列表中選擇了product1，則網站應該導航到該產品的選項值http://www.domain.co.uk/test?specs=5,

任何想法如何做到這一點.. ?? 感謝

Answer 1

您可以使用以下兩種方法中，純JavaScript或jQuery的：

的jQuery：

$("#Product").change(function() 
{ 
    location.href = $(this).val(); 
}); 

Working Example

的Javascript：

<select id="Product" name="Product" onChange='location.href = this.value'> 

Working Example

Answer 2

這是從HTML的角度非常糟糕的易用性 - 超鏈接是有導航。表單用於處理數據。

也就是說，您需要做的是捕獲javascript中下拉的onchange事件，然後使用選定的值導航到頁面。

Answer 3

最簡單的方法是添加一個onchange處理程序

Html.DropDownList("Product", new SelectList(Model.Products, "ProductUrl", "ProductName"), new {onchange="javascript:location.href=this.options[this.selectedIndex].value;"}) 

或者你可以使用Rionmonster的jQuery的方法，該方法不相同。