別の選択リストの選択に基づいて、選択リストを動的に更新しようとしています。jQueryコード
<script type="text/javascript">
// Respond to Category selection
$('#selectCategory').change(function () {
// Ajax call to 'Specialties' action method with parameter searchType
$.get('@Url.Action("Products", "Product")',
{ "parameter1": $(this).val(), "parameter2": null },
function (data) {
$('#products').html(data);
});
});
</script>
景色
<div id="products">
@Html.Partial("_Products")
</div>
部分図
@model MyMVC3App.Models.MyViewModel
<select mid="productSelect" name="@ClarusConstants.PropertyNames.Specialty" >
<option value="0">@Resources.LabelText_SelectASpecialty</option>
foreach (Product p in Model.Products)
{
<option value="@Product.ID" name="@product.Description</option>
}
</select>
アクションメソッド
public ActionResult Specialties(string parameter1, string parameter2)
{
List<Product> products = myDB.Products.Where(p => p.Category == parameter1).ToList();
ViewModel myViewModel = new ViewModel();
viewModel.Products = products;
if (Request.IsAjaxRequest())
{
return PartialView("_Products", myViewModel);
}
else
{
return View(myViewModel);
}
}
コールバックは正しいアクションメソッドにヒットしており、ajaxリクエストが検出されています。残念ながら、products divのコンテンツ(InnnerHTML)は置き換えられていないため、すべて無料です。
よろしくお願いします。