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

Posted

技术标签:

【中文标题】Ajax 请求复杂类型在 ApiController 参数中为空【英文标题】:Ajax request Complex type is getting null in a ApiController parameter 【发布时间】:2021-08-30 04:02:24 【问题描述】:

我是 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);

【问题讨论】:

尝试删除contentType: 'application/json', - 完全删除contentType 【参考方案1】:

修复你的 ajax:

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

                    alert(textStatus);
                
            );

如果它仍然无法正常工作,那么也修复您的数据:

删除 parseint

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

让你的数据语法更简单,例如用这个替换你的clientId

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

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

【讨论】:

以上是关于Ajax 请求复杂类型在 ApiController 参数中为空的主要内容,如果未能解决你的问题,请参考以下文章

ajax跨域简单请求和复杂请求

ajax请求传参数复杂对象list,后端springmvc接收参数

SpringMVC—对Ajax的处理(含 JSON 类型)

SpringMVC——对Ajax的处理(包含 JSON 类型)

ajax请求json数据返回啥类型

将复杂类型作为数据传递给 jquery ajax post