Ajax 请求复杂类型在 ApiController 参数中变空

时间:2021-06-14 08:22:05

标签: jquery asp.net-mvc asp.net-ajax

我是 ASP.NET MVC 的新手,正在尝试创建一个页面。我的页面有一个带有分页的搜索区域和网格视图。

PagerModel 模型是包含分页细节的常用模型。

产品页面搜索模型和寻呼机模型

public class ProductSearchModel
{       
    public int ClientId { get; set; }
    public IList<SelectListItem> Clients { get; set; } = new List<SelectListItem>();
    
    public int StoreId { get; set; }
    public IList<SelectListItem> Stores { get; set; } = new List<SelectListItem>();

    public string Title { get; set; }       
    public string Sku { get; set; }
  
    public string Vendor { get; set; }
    public IList<SelectListItem> Vendors { get; set; } = new List<SelectListItem>();
   
    public string ProductType { get; set; }
    public IList<SelectListItem> ProductTypes { get; set; } = new List<SelectListItem>();

    public PagerModel PagingModel { get; set; } = new PagerModel();
}

public class PagerModel
{
    public int PageTotal { get; set; }
    public int PageIndex { get; set; }
    public int PagingButtonCount { get; set; }
    public int PageNumber { get; set; }
    public int PageSize { get; set; }
    public int PagesCount { get; set; }
    public bool ShowTotalSummary { get; set; }
}

这是我的 Ajax 请求;我也尝试使用 JSON.stringify(postData),但它仍然不起作用:

function fetchData(pageNumber) {
    var $loading = "<div class='loading'>Please wait...</div>";
    $('#updatePanel').prepend($loading);

    var clientId = $("#@Html.IdFor(model => model.ClientId)").val();
    var storeId = $("#@Html.IdFor(model => model.StoreId)").val();
    var title = $("#@Html.IdFor(model => model.Title)").val();
    var sku = $("#@Html.IdFor(model => model.Sku)").val();
    var productType = $("#@Html.IdFor(model => model.ProductType)").val();
    var vendor = $("#@Html.IdFor(model => model.Vendor)").val();
    var pageSize = @Model.PagingModel.PageSize;
    var postData = {
                    clientId: parseInt(clientId),
                    storeId: parseInt(storeId),
                    title: title,
                    sku: sku,
                    productType: productType,
                    vendor: vendor,
                    pagingModel: {
                        pageNumber: pageNumber,
                        pageIndex: (pageNumber - 1),
                        pageSize: pageSize
                    }
            };
            debugger;
            $.ajax({
                type: 'POST',
                dataType: 'json',
                contentType: 'application/json',
                url:  "@(Url.Action("PopulateProductGrid", "Products"))",                
                data: postData,//JSON.stringify(postData),
                success: function (data) {
     

                },
                error: function (jqXHR, textStatus, errorThrown) {

                    alert(textStatus);
                }
            });
}

这是 ProductController 操作方法。我试过没有 [FromBody],但它不起作用:

[HttpPost]
public ActionResult PopulateProductGrid([FromBody] ProductSearchModel searchModel)
{
    var productModel = GetProducts(searchModel);

    var data = new { 
                       Product = productModel.Products, 
                       TotalPage = productModel.PagerModel.PageTotal, 
                       PagesCount = productModel.PagerModel.PagesCount, 
                       PagingButtonCount = productModel.PagerModel.PagingButtonCount 
                   };

    return Json(data);
}

1 个答案:

答案 0 :(得分:0)

修复你的ajax:

 $.ajax({
                type: 'POST',
                 url: "/Products/PopulateProductGrid",                
                data: postData,
                success: function (data) {
     
                },
                error: function (jqXHR, textStatus, errorThrown) {

                    alert(textStatus);
                }
            });

如果它仍然不起作用,那么也修复您的数据:

删除解析

  clientId: clientId,
   storeId: storeId,
....

并使您的数据语法更简单,例如用这个替换您的clientId

 var clientId = $("#clientId").val();
// and so on for another data controls

如果您的视图控件中没有 id,则添加它们。

相关问题