使用Jquery在下拉选择事件上填充MVC WebGrid

因此，我做了一些研究，并在谷歌上搜索了如何做到这一点，但我遇到了一个障碍，需要帮助，我在用DropDownList值的选定值填充GridView（WebGrid MVC）时遇到了问题

我已经成功地将控制器数据传递给视图，我只是在努力填充下拉列表中选择的网格。当我在视图中包含网格时，它会在页面呈现时填充网格，并且我只希望在选择下拉列表值时填充网格。请协助，我是MVC的新手

public class HomeController : Controller
{

    public ActionResult Index()
    {

        ProductPortalService.Service1Client client = new ProductPortalService.Service1Client();

        List<Top_100_Result> productType = client.GetTopProductsByTypeName();

        ViewBag.ProductType = new SelectList(productType.Select(x => x.Product_Type_Name).Distinct().OrderBy(x => x));

        return View(productType);
    }


    public JsonResult ProductDescription(string ProductType)
    {
        ProductPortalService.Service1Client client = new ProductPortalService.Service1Client();

        List<Top_100_Result> productDesctriptionList = client.GetTopProductsByCategory(ProductType).Where(x => x.Product_Type_Name == ProductType).ToList();//new List<Top_100_Result>();

        var grid = new WebGrid(productDesctriptionList);
        var htmlString = grid.GetHtml(tableStyle: "paramTable", htmlAttributes: new { id = "grid" }, columns: grid.Columns(
                                    grid.Column("Rank", "Rank"),
                                    grid.Column("Product_Number", "Product Number"),
                                    grid.Column("Product_Description", "Product Description"),
                                    grid.Column("Product Type_Name", "Product Type Name")));


        return Json(productDesctriptionList.Select(x => x.Product_Description)
                        , JsonRequestBehavior.AllowGet);
    }

}

公共类HomeController:控制器
{
公共行动结果索引（）
{
ProductPortalService.Service1Client client=新的ProductPortalService.Service1Client（）；
List productType=client.GetTopProductsByTypeName（）；
ViewBag.ProductType=new SelectList（ProductType.Select（x=>x.Product\u Type\u Name）.Distinct（）.OrderBy（x=>x））；
返回视图（productType）；
}
公共JsonResult ProductDescription（字符串ProductType）
{
ProductPortalService.Service1Client client=新的ProductPortalService.Service1Client（）；
List productDescriptionList=client.GetTopProductsByCategory（ProductType）.Where（x=>x.Product_Type_Name==ProductType）.ToList（）；//new List（）；
var grid=新的WebGrid（ProductDescriptionList）；
var htmlString=grid.GetHtml（tableStyle:“paramTable”，htmlAttributes:new{id=“grid”}，columns:grid.columns(
网格列（“秩”、“秩”），
网格栏（“产品编号”、“产品编号”），
网格栏（“产品描述”、“产品描述”），
网格栏（“产品类型名称”、“产品类型名称”）；
返回Json（productDescriptionList.Select（x=>x.Product\u说明）
，JsonRequestBehavior.AllowGet）；
}
}

将网格放在局部视图中，并通过下拉式ajax调用该局部视图。 像这样使用jquery：

$('#myDropDown').change( function() {

 /* Get the selected value of dropdownlist */
 var selectedID = $(this).val();

 /* Request the partial view with .get request. */
 $.get('/Controller/MyAction/' + selectedID , function(data) {

     /* data is the pure html returned from action method, load it to your page */
     $('#partialPlaceHolder').html(data);
     /* little fade in effect */
     $('#partialPlaceHolder').fadeIn('fast');
 });

---

}))

我该怎么做呢，我可以创建一个局部视图，用Jquery填充GridThank Hadee，我弄明白了，我按照你的建议把它放在局部视图中，非常感谢。