ASP.Net MVCのAjaxを使用して上の問題や変更

Question

でドロップダウンリストを私は_productsFilteredPartialと呼ばれる部分図を持っているし、今私はアヤックスアヤックスで_productsFilteredPartialを更新し、フィルタリングする

<div class="form-group"> 
    <label for="sel1"></label> 
    <select class="form-control" id="cat"> 
     <option>Select From The List</option> 
     @{ 
      DataEntities ctx = new DataEntities(); 
      var cat = ctx.Categories.OrderByDescending(p => p.CategoryName); 
      foreach (var item in cat) 
      { 
       <option Value="@item.Id" >@item.Name</option> 
      } 
     } 
    </select> 
</div> 

のような製品のドロップダウンリストを必要とします.BeginFormと各オプションの値に基づいて、ドロップダウンリストの変化に製品をフィルタリング（@item.Id）

_productsFilteredPartialで私は

@model IEnumerable<Example.Models.NW.Product> 
<table> 
    <tr> 
     <th>Product ID</th> 
     <th>Product Name</th> 
     <th>Supplier ID</th> 
     <th>Category ID</th> 
     <th>Unit Price</th> 
    </tr> 
@foreach (var item in Model) { 
<tr> 
    <td>@item.ProductID</td> 
    <td>@item.ProductName</td> 
    <td>@item.SupplierID</td> 
    <td>@item.CategoryID</td> 
    <td>@item.UnitPrice</td> 
</tr> 
} 
</table> 

を持っています

私はこの

<script language="JavaScript"> 
    $('#id').on('change', 'productsFilteredPartial', 
     new AjaxOptions 
    { 
     HttpMethod = "GET", 
     UpdateTargetId = "Filtered-Products", 
     InsertionMode = InsertionMode.Replace, 
     LoadingElementId = "loadingDisplay", 

    } 
    }); 
</script> 

を試してみましたが、これはリンク生成のためのより多くの部分的なビューにドロップダウンリストの選択されたオプションから値を渡す方法がわかりません。これを修正する方法を教えてください。

Answer 1

あなたのコードは有効とは思われません！あなたは間違った方法でjavascriptとasp.net ajaxヘルパーメソッドを混ぜている！

あなたが理想的に行うべきことは、SELECT要素のchangeイベントをリッスンし、選択したオプション値をサーバに送信します。ここでは、アクションメソッドがグリッドの部分ビュー結果を返します。

だからあなたのメインビューには、JavaScriptの部分で、あなたはグリッド結果

$(function(){ 

    $("#cat").change(function(){ 
     var v=$(this).val(); 
     $("#grid").load('@Url.Action("FilteredProducts","Home")?cat='+v); 
    }); 

}); 

を更新するために、jQueryのloadメソッドを使用することができます今、コンテナのdiv

<div id="grid"> 
@Html.Partial("_productsFilteredPartial") 
</div> 

に部分図を含める必要があります

HomeControllerでFilteredProductsというアクションメソッドがあり、カテゴリを受け取り、部分的なビュー結果を返すと仮定します。あなたは `.change（）`イベントを処理し、（それまで選択されたオプションの値を渡す）サーバーメソッドを呼び出して、その方法では部分ビュー（またはJSON）を返すようにAJAXを使用する必要が

public ActionResult FilteredProducts(string cat) 
{ 
    var result = new List<Example.Models.NW.Product>(); 
    // to do : Load the list of products to result 
    return PartialView("_productsFilteredPartial",result); 
}