如何將選定的下拉列表值傳遞給MVC 4中的Ajax.ActionLink？

Question

我試圖通過一個表格值「客戶ID」在MVC 4.使用Ajax.Actionlink誰能告訴我（i.e.dropdownlist選擇的值），我在做什麼錯在這裏？

<div class="editor-label"> 
    @Html.LabelFor(model => model.CustomerID, "Customer Name") 
</div> 
<div class="editor-field"> 
    @Html.DropDownListFor(model => model.CustomerID, Model.CustomersList, "-- Select --") 
    @Html.ValidationMessageFor(model => model.CustomerID) 
</div> 

<div id="ApptsForSelectedDate"> 
    @Ajax.ActionLink("Click here to view appointments", 
        "AppointmentsList", 
        new {id = Model.CustomerID}, 
        new AjaxOptions 
        { 
         UpdateTargetId = "ApptsForSelectedDate", 
         HttpMethod = "GET", 
         InsertionMode = InsertionMode.Replace, 
         LoadingElementId = "progress" 
        } 
       )    
</div> 
<div id="progress"> 
    <img src="../../Images/ajax-loader.gif" alt="loader image" /> 
</div> 

我控制器的方法是這樣的：

public PartialViewResult AppointmentsList(int id) 
{ ... } 

Answer 1

您應該使用Ajax.BeginForm，把下拉表單內。這樣該值將被自動傳遞。

不幸的是，因爲你不能嵌套的HTML表單，如果你已經有了另一種形式的包裝這個標記不能使用嵌套的表格。

在這種情況下，你可以使用正常的鏈接：

@Html.ActionLink(
    "Click here to view appointments", 
    "AppointmentsList", 
    null, 
    new { id = "applink" } 
) 

，並在一個單獨的JavaScript文件AJAXify它和此刻的AJAX請求讀取選擇下拉值追加必要的信息來查詢字符串發送：

$(function() { 
    $('#applink').click(function() { 
     $('#progress').show(); 
     $.ajax({ 
      url: this.href, 
      type: 'GET', 
      data: { id: $('#CustomerID').val() }, 
      complete: function() { 
       $('#progress').hide(); 
      }, 
      success: function(result) { 
       $('#ApptsForSelectedDate').html(result); 
      } 
     }); 
     return false; 
    }); 
});