把DropDownList的值賦給@Ajax.ActionLink

Question

我有一個Partial View,DropDownList。我有Main View，menu，我可以在這裏打電話給Partial View。我正在嘗試使用Partial View中的filtering以及來自它的參數。爲此，我需要將ddl的選定value到@Ajax.ActionLink。我正在嘗試使用js來執行此操作，但該頁面只是在不調用我的Partial View的情況下重新加載。從主視圖

的ActionLink：

@Ajax.ActionLink(
"Parts", 
"PartsPartial", 
new 
{ 
    categorie = "add" 
}, 
new AjaxOptions 
{ 
    HttpMethod = "GET", 
    InsertionMode = InsertionMode.Replace, 
    UpdateTargetId = "content" 
}, new { @class = "button" } 
) 

形式方法管窺得使過濾：

<form method="get"> 
    <div> 
     <label>Category: </label> 
     @Html.DropDownList("categorie", Model.Categories as SelectList, 
     htmlAttributes: new { @class="form-control"}) 

     <label>Brand: </label> 
     @Html.DropDownList("brand", Model.Brands as SelectList, 
     htmlAttributes: new { @class="form-control" }) 
     <input type="submit" name="add" value="Filter" /> 

    </div> 
</form> 

而且我的控制器：

public ActionResult PartsPartial(string categorie, int? brand) 
    { 
     string str = "add"; 
     List<bs_categories> categoriesList = _db.bs_categories.ToList(); 
     List<bs_brands> brandsList = _db.bs_brands.ToList(); 

     if (categorie == str) 
     { 
      IQueryable<bs_parts> prts = _db.bs_parts; 

      PartsViewModel pViewModel = new PartsViewModel 
      { 
       Parts = prts.ToList(), 
       Categories = new SelectList(categoriesList, "categories_id", "categories_name"), 
       Brands = new SelectList(brandsList, "brands_id", "brands_name") 
      }; 
      return PartialView(pViewModel); 
     } 

     decimal categoryId = Convert.ToDecimal(categorie); 

     var parts = _db.bs_parts.Where(x => x.parts_category_id == categoryId).OrderBy(x => x.parts_id); 

     PartsViewModel pvm = new PartsViewModel 
     { 
      Parts = parts.ToList(), 
      Categories = new SelectList(categoriesList, "categories_id", "categories_name"), 
      Brands = new SelectList(brandsList, "brands_id", "brands_name") 
     }; 
     return PartialView(pvm); 
    } 

這裏是JS做替換：

<script> 
    $(function() { 
     $('#add').click(function() { 
      var type = $('#categorie').val(); 

      $.ajax({ 
       url: this.href, 
       type: 'GET', 
       data: { type: type }, 
       cache: false, 
       success: function (result) { 
        $('#content').prepend(result); 
       } 
      }); 
      return false; 
     }); 
    }); 
</script> 

可能是我錯過了什麼？

Answer 1

需要輸入的類型更改爲button：

<form method="get"> 
    <div> 
     <label>Category: </label> 
     @Html.DropDownList("categorie", Model.Categories as SelectList, 
     htmlAttributes: new { @class="form-control"}) 

     <label>Brand: </label> 
     @Html.DropDownList("brand", Model.Brands as SelectList, 
     htmlAttributes: new { @class="form-control" }) 
     <input type="button" id="add" name="add" value="Filter" /> 

    </div> 
</form> 

時，你的類型submit你的Ajax代碼將永遠不會被調用