Jquery Ajax Post Object response 400 error code in Razor-CodePudding

I'm trying Jquery Ajax Post to Razor Page action. I created custom object for post then I'm getting 400 Error Code.

Here is my Class struct:

public class InsertProductPrice
{
    public long ID { get; set; }
    public int PKademe11 { get; set; }
    public int PKademe12 { get; set; }
}

Here is my Razor Page Action:

public IActionResult OnPostSavePrice(InsertProductPrice price)
{
    return new OkResult();      
}

And here is my Jquery Code (i tried with 'data: JSON.stringify(price)' but same result);

var url =   `/Supplier/insertProductPrices?handler=SavePrice`;
    $.ajax({
        type: "POST",
        url: url,
        dataType: 'json',
        data:  price,
        //contentType: "application/json",
        beforeSend: function (xhr) {
                    
        },
        success: function (response) {
            
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert(jqXHR.responseText);
        }
    });

and here is my object;

var price = {
        "ID": priceArray[index].id,
        "PKademe11": Number(body.children[0].children[4].children[0].value),
        "PKademe12": Number(body.children[0].children[5].children[0].value),
    }; 
//Like this
price = {
        "ID": 100,
        "PKademe11": 0,
        "PKademe12": 0,
    };

CodePudding user response：

You need to add AntiForgoryToken to header:

View:

@Html.AntiForgeryToken()

js:

var url =   `/Supplier/insertProductPrices?handler=SavePrice`;
    $.ajax({
        type: "POST",
        url: url,
        dataType: 'json',
        data:  price,
        headers: { "RequestVerificationToken": $('input[name="__RequestVerificationToken"]').val() },
        beforeSend: function (xhr) {
                    
        },
        success: function (response) {
            
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert(jqXHR.responseText);
        }
    });

CodePudding user response：

I usually use this method to send my Model to my Controller method. I will try to show you regarding your scenario, how you can do this:

You Model:

var price = 
    {
      "ID": 100,
      "PKademe11": 1,
      "PKademe12": 2
    };

Corresponding AJAX call:

    //var url = `/Supplier/insertProductPrices?handler=SavePrice`;
    //Send the JSON array to Controller using AJAX.
    $.ajax({        
        type: "POST",
        url: "@Url.Action("OnPostSavePrice","Supplier")",
        data:{"json": JSON.stringify(price)},
        dataType: "json",
        success: function (response) {
          //do whatever as required
        },
        error: function (jqXHR, textStatus, errorThrown) {
           alert(jqXHR.responseText);
         }
    });

And you can receive your Model like this in your OnPostSavePrice method: Make sure to import the System.Web.Script.Serialization namespace:

using System.Web.Script.Serialization

[HttpPost]
public IActionResult OnPostSavePrice(string json)
{
    var serializer = new JavaScriptSerializer();
    dynamic jsondata = serializer.Deserialize(json, typeof(object));
    //Get your variables here from AJAX call
    var ID = jsondata["ID"];
    var PKademe11 = jsondata["PKademe11"];
    var PKademe12 = jsondata["PKademe12"];
    return new OkResult();
}