如何从视图中的 JQuery 下拉列表中获取选定的值到控制器

Question

我正在编写一个程序，该程序使用 asp.net MVC 和 Bing Maps 在地图上绘制公交路线。我希望能够更改地图显示的公交路线，方法是使用下拉列表选择路线名称，并将该名称值作为字符串传递回控制器中的方法，该方法将使用它查询数据库

相关代码如下：

@Html.DropDownList("BusRouteNames", new SelectList())

<form action="#">
    <fieldset>
        <label for="BusRoute">Select a Bus Route</label>
        <select name="busroute" id="busroute">
            <option selected="selected" value="1">Stop 1</option>
            <option value="2">Stop 2</option>
            <option value="3">Stop 3</option>
            <option value="4">Stop 4</option>
            <option value="5">Stop 5</option>
        </select>
        <input type="button" title="Calculate" value="Calculate Route" onclick="location.href=''" />
    </fieldset>
</form>

我认为我可以使用 @Url.Action() 方法来执行此操作，但我了解到您不能以这种方式请求 JavaScript 变量，所以我不确定该怎么做。

提前感谢您的帮助

Answer 1

这是我建议的方法。将模型传递给您的 cshtml 视图会很有帮助。然后您可以通过模型和控制器创建下拉列表并处理选择。

如：

// update your model
public class YourModel {
    public class List<SelectListItem> BusRoutes { get; set; }
    public string SelectedBusRoute { get; set; }
}

// in your controller get method
public ActionResult<YourModel> Get(string route = null)
{
    var model = new YourModel();
    // add your data
    model.BusRoutes = new List<SelectListItem> {
        new SelectListItem { Text = "Stop 2", Value = "2" },
        // add rest...
    };
    // set selected value
    model.SelectedBusRoute = route ?? "2";
    return View(model);
}

// in YourModel.cshtml
@model YourModel
@using (Html.BeginForm("Get", "YourController", FormMethod.Get))
{
    @Html.DropDownListFor(model => model.SelectedBusRoute, Model.BusRoutes, "-- Select Route--");
    <button type="submit">Calculate</button>

}
@* Generate your map using the Model.SelectedBusRoute value *@