如何在下拉列表中获取所选选项的值

Question

我的视图中有一个下拉列表 下拉列表显示枚举值 枚举下拉列表的代码是

      @Html.DropDownListFor(model => model.hobbyhome.HobbyDetailList.First().course, HobbyHomesWebApp.Utility.EnumList.ToSelectList(HobbyHomes.Model.Course.Advance, "Select Course"), "--Select Course--", new { @id="Course"}) <font color="red">*</font>   

课程生成器

  <div class="editor-field">
 <select id="course" name="course"><option value="">--Select Course--              </option>
     <option value="Basic">Basic Level</option>
      <option value="Intermidiate">Intermidiate Level</option>
       <option value="Advance">Advance Level</option>
      </select> <font color="red">*</font>   
              </div>

   var course = from Course c in Enum.GetValues(typeof(Course))
                         select new { ID = c, Name = c.ToString() };
                        ViewData["course"] = new SelectList(course, "ID", "Name");

参与输入选项包括Basic，intermediate和Advance

我希望通过Ajax函数获取所选的值（字符串或int），因为我正在尝试填充其他下拉列表

这是我的ajax功能：

    $("#Course").change(function () {
        var Hobbyid = $("#Hobby").val();
        var Cid=$("#Course").val();
        var urlHobbyhome = '@Url.Action("FetchStateByHobbyId")';
        $.ajax({
            type: "POST",
            url: urlHobbyhome,
            data: { id: Hobbyid,cid:Cid },
            success: function (data) {
                $('#State').empty();
                $('#State')
                        .append($('<option>', { value: "0" })
                        .text("-- Select State --"));
                $.each(data, function (key, value) {

                    $('#State')
                        .append($('<option>', { value: value.Value })
                        .text(value.Text));
                });
            }
        });

任何人都可以帮助我

Answer 1

您可以使用jQuery附加到DropDownList的Change事件。

$("#YourDropDownID").change(function () {
     var itemSel = $("#YourDropDownID").val();
     // Do your Ajax logic using the selected value stored in variable 'itemSel'

});

修改

测试此功能：

$("#course").change(function () {
        var Hobbyid = $("#Hobby").val();
        var Cid=$("#course").val();
        alert("This is the CourseID:" + Cid);  
        var urlHobbyhome = '@Url.Action("FetchStateByHobbyId")';
        $.ajax({
            type: "POST",
            url: urlHobbyhome,
            data: '{id:' + Hobbyid + 'cid:' + Cid + '}',
            success: function (data) {
                $('#State').empty();
                $('#State')
                        .append($('<option>', { value: "0" })
                        .text("-- Select State --"));
                $.each(data, function (key, value) {

                    $('#State')
                        .append($('<option>', { value: value.Value })
                        .text(value.Text));
                });
            }
        });
});

我更改了＆＃34;数据＆＃34;属性为字符串串联，因为使用＆＃34; id＆＃34;时存在一些问题。名称。添加了一个显示所选课程ID的警报，并将选择器更改为使用小写ID。请完全替换我的javascript函数，现在让我们。