0

私はASP.NETMVC2を学んでいます。私がやろうとしていることは、非常に単純です。

  1. ドロップダウンに製品タイプのリストを入力します
  2. ドロップダウン値が変更されたら、モデルに投稿し、選択した値を渡します。
  3. その特定の製品タイプの製品のリストをコレクションに入力します

この時点まではすべてが機能していますが、ビューが更新されておらず、特定の製品タイプの製品のリストが表示されていません。

[HTTPPost]ビューモデルに投稿するだけで、実際にはビューが更新されないからかもしれないと思っていました。

ドロップダウンの選択に基づいてビューを更新する方法に関する提案はありますか？

モデル：

パブリッククラスSuppliersModel{パブリックSuppliersModel（）{}

public SuppliersModel(string type)
{
    ProductsByType = Products.Where(i => i.Type == type);
}

public IEnumerable<Products> ProductsByType { get; set; }

public List<Products> Products
{
    get 
    {
        List<Products> mockProducts = new List<Products>()
        {
            new Products{Type="Fruit", Name="Apple"},
            new Products{Type="Fruit", Name="Orange"},
            new Products{Type="Vegetables", Name="Potato"},
            new Products{Type="Vegetables", Name="Carrot"}
        };
        return mockProducts;
    }
}

public SelectList ProductTypes
{
    get { return GetProductTypes(); } 
}

private SelectList GetProductTypes()
{
    var productTypes = new List<SelectListItem>
        {
            new SelectListItem{ Value="Fruit",Text="Fruit"},
            new SelectListItem{ Value="Vegetables",Text="Vegetables"}
        };

    var list = new SelectList(productTypes, "Value", "Text");
    return list;
}

}

public class Products {public string Type {get; セットする; } public string Name {get; セットする; }}

意見：

<script type="text/javascript">
    $(function () {
        $('#products').change(function () {
            $.post('<%=Url.Action("GetProductsByType", "Suppliers")%>', { type: $(this).val() },
            function (result) {
            });
        });
    });
</script>
<h2>
    Suppliers</h2>
<%= Html.DropDownList("products",Model.ProductTypes) %>
<table>
    <% if (Model.ProductsByType != null) foreach (var item in Model.ProductsByType)
           { %>
    <tr>
        <td>
            <%= item.Name %>
        </td>
        <td>
            <%= item.Type %>
        </td>
    </tr>
    <% } %>
</table>

コントローラ：

public class SuppliersController : Controller
{
    public ActionResult Suppliers()
    {
        SuppliersModel model = new SuppliersModel();
        return View(model);
    }

    [HttpPost]
    public ActionResult GetProductsByType(string type)
    {
        //This executes when the value in the drop down changes
        SuppliersModel model = new SuppliersModel(type);
        return View(model);
    }
}
4

1 に答える 1

0

投稿後にコントローラーが返すHTMLに対して何もしていないようです。

<script type="text/javascript">
    $(function () {
        $('#products').change(function () {
            $.post('<%=Url.Action("GetProductsByType", "Suppliers")%>', { type: $(this).val() },
            function (result) {
                //result will have the html that your controller returns after the post
                // you can do something like,
                $('#some-div').html(result);
            });
        });
    });
</script>
于 2013-02-02T16:14:59.400 に答える