在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();
});

工作示例

Javascript:

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

工作示例

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方法来做同样的事情。