javascript - 将 html.beginform 内的 Dropdown 值传递给 ajax 操作调用

Question

我对 javascript 和 ajax 很陌生。我的问题是，我试图将从下拉列表中选择的值传递给方法的 ajax 调用，以显示部分 View 。

这是我的索引 View :

@ModelType FCSWebMVC.Models.SubmitBaselineSelectLists
@Code
ViewData("Title") = "Status Area"
End Code
<h4>@ViewData("Title")</h4>
<br />

<div>
@Using (Html.BeginForm("GetBaseline", "StatusArea"))
@Html.Label("Select Baseline:")
@Html.DropDownList("cmbBaselineType", Model.m_SelectListBaseline)@<br />@<br />
@<input type="button" value="Select!" />
End Using
</div>

<script type="text/javascript">
$(document).ready(function () {
    $("#cmbBaselineType").onchange(function () {
        var baseline = $('#cmbBaselineType').val();
        $("#viewPlaceHolder").load("@Url.Action("StatusList", "StatusArea")", { Bid: baseline },
            function (response, status, xhr) {
                if (status == "error") {
                    alert("An error occurred while loading the results.");
                }
            });
    });
});
</script>

<div id="viewPlaceHolder"></div>

我不确定如何获取下拉列表中所选项目的值并将其传递给 Controller ​​中的操作方法 StatusList。

这是我的 StatusList 操作方法:

'action to display current features based on baseline
    Public Function StatusList(ByVal search As String, ByVal Bid As Integer) As ActionResult
        Return PartialView("_StatusList", m_StatusRepository.GetStatusList(Bid, search))
    End Function

Answer 1

你可以试试这个:

<script type="text/javascript">
$(document).ready(function () {
    $("#cmbBaselineType").on('change', function () {
        var baseline = $(this).val();
        $.ajax({
           type: 'GET',
           path: 'StatusList',
           data: { search: '', Bid: baseline },
           success: function(result){
             $('#viewPlaceHolder').html(result);
           },
           error: function(){
             //do something
           }
        });
});});</script>

P.s @Html.DropDownList() 将分配一个“id”属性(尽管评论另有说明)。