Develop Reference

Posting to mvc controller action always return error

I am new to mvc and I am tring to use ajax to get and post data. Get is working fine but when I use post using the same ajax code while change it to post give me always error 400. I tried with many type of data sent and the action in the controller is empty to eleminate that the error occour there although i new 400 error is a bad request but I couldn't figure it out.
The code is as follow
async function SaveTheDay(url, data) {
if (data != null) {
$.ajax({
url: url,
type: 'POST',
dataType: "json",
data: data,
success: function (response) {
if (response) {
console.log("Ok");
} else {
console.log("not valid ");
}
},
error: function (req, status, error) {
console.log("error "+status+" "+error);
}
})//not null
}
}//SaveTheDay
the controller action is :
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> SaveDay(InfoDay day)
{
return View("DayTrial");
}
and I call the function when the save button cliked as:
//define the object
var infoDay =
{
userId :userId,
date: TheDate.value ,
items :items ,
itemsAmount : itemsAmount,
itemsMealTime :itemsMealTime,
dailyConsumedkCal: dailyConsumedkCal,
dayTotal :"",
bloodData :"",
bloodSugarData :"",
sleepData :"",
indexData :"",
dayCost :0
}
SaveTheDay("/Days/SaveDay", infoDay);
here is the InfoDay class
public class InfoDay
{
public int userId { get;
set; }
public string date { get; set;
}
public string? items { get;
set; }
public string? itemsAmount {
get; set; }
public string? itemsMealTime {
get; set; }
public int? dailyConsumedkCal
{ get; set; }
public string? dayTotal {
get; set; }
public string? bloodData {
get; set; }
public string? bloodSugarData
{ get; set; }
public string? sleepData {
get; set; }
public string? indexData {
get; set; }
public int? dayCost { get;
set; } = 0;
}

The ValidateAntiForgeryToken attribute prevents 'Cross-site request forgery' attacks in your MVC application.
See https://learn.microsoft.com/..../security/anti-request-forgery?view=aspnetcore
Do not remove it.
To avoid the 400 error, you must pass the token with your POST request.
async function SaveTheDay(url, data) {
if (data != null) {
$.ajax({
url: url,
type: 'POST',
dataType: "json",
data: data,
beforeSend: function (xhr) {
xhr.setRequestHeader('RequestVerificationToken',
$('input:hidden[name="__RequestVerificationToken"]').val());
},
success: function (response) {
if (response) {
console.log("Ok");
} else {
console.log("not valid ");
}
},
error: function (req, status, error) {
console.log("error "+status+" "+error);
}
})//not null
}
}//SaveTheDay
Of course the hidden field with the token has to be present in the view.
The HTML Helper Html.AntiForgeryToken includes the token.
#Html.AntiForgeryToken()
If you use a form tag helper, the token is also included.
See https://learn.microsoft.com...?view=aspnetcore-6.0#the-form-tag-helper

Actionmethod cant get double value in parameter from ajax post

Via the 'data' properie on a ajax post i want to send a parameter to the action method. All values in the parameter object get through except the decimal/double values. Why is this and what can i do about it?
I have tried to change the value to string and even int. And it gets through but it is important that it gets through as a decimal or double.
mapHub.client.requestForHelpInClient = function (requestDetails) {
$.ajax({
type: "POST",
url: '#Url.Action("RequestPartialView", "Supplier")',
data: requestDetails,
success: function (response) {
$("#Request").html(response);
},
error: function (error) {
console.log(error);
}
});
}
[HttpPost]
public ActionResult RequestPartialView(RequestDetails reqDetails)
{
RequestViewModel reqVm = new RequestViewModel() { requestDetails = reqDetails };
return PartialView("RequestPartialView",reqVm);
}
//This is the object i pass into requestForHelpInClient function that executes the ajax call
public class RequestDetails
{
public int CustomerId { get; set; }
public Customer Customer { get; set; }
public int NumberOfHours { get; set; }
public string TypeOfMachine { get; set; }
public List<Supplier> NearestSupplierList { get; set; }
}
public class Customer : MapClient
{
public int CustomerID { get; set; }
public string AspNetUserID { get; set; }
public string Name { get; set; }
public double Latitude { get; set; }
public double Longitude { get; set; }
}
every value gets through from the ajax call to the action method parameter excepts the latitude and longitude decimal values.
I get no error message. The value just says '0'

You need to stringify your object before posting
mapHub.client.requestForHelpInClient = function (requestDetails) {
$.ajax({
type: "POST",
url: '#Url.Action("RequestPartialView", "Supplier")',
data: JSON.stringify(requestDetails),
success: function (response) {
$("#Request").html(response);
},
error: function (error) {
console.log(error);
}
});
}
That should fix it

How to send right model

I send model with ajax on server with post request.
I have next model and a controller that has a method of fasting.
public class TestDto: BaseDto
{
[Required]
public ProductGalleryDto GalleryProduct { get; set; }
public int? RetailPriceEur { get; set; }
[Required]
public int? AmountSpc { get; set; }
public bool? PrizeSent { get; set; }
public string Comment { get; set; }
public DateTime? StartDate { get; set; }
[Required]
public DateTime? ExpirationDate { get; set; }
public bool IsParticipant { get; internal set; }
}
public override IActionResult Post([FromBody] TestDto item)
{
if (!IsAdmin)
return BadRequest(ApiErrorCodes.InsufficientPriveleges);
if (!ModelState.IsValid)
return BadRequest(ApiErrorCodes.RequiredFieldsMissing, ModelState.Keys.FirstOrDefault());
}
JS:
var object = JSON.stringify({
createddate: startdate,
retailpriceeur: price,
amountspc: spobicoinprice,
prizesent: false,
expirationdate: expirationdate,
comment: comment,
productgalleryid: productgalleryDto
});
$.ajax({
headers: { "Authorization": "Bearer " + localStorage.getItem('authToken') },
url: "/api/testapi/",
method: "post",
data: object,
contentType: "application/json; charset=utf-8",
success: function (result) {
}
});
Fields in js are also present in the model
Actual: model is not valid.
How me fix that? Please, help

You Shroud send an object not JSON string in ajax request as this example :
var person = new Object();
person.name = "name";
person.surname = "surname";
$.ajax({
url: 'http://localhost:3413/api/person',
type: 'POST',
data: person,
success: function (data, textStatus, xhr) {
console.log(data);
},
error: function (xhr, textStatus, errorThrown) {
console.log('Error in Operation');
}
});

Passing JSON to a Controller with Multiple Models and/or Parameters via AJAX POST

I wrote this Controller:
[HttpPost]
public JsonResult CheckOut(List<POS_model> pos, double totalPayment)
{
try
{
var json = JsonConvert.SerializeObject(pos);
DataTable posTable = (DataTable)JsonConvert.DeserializeObject(json, (typeof(DataTable)));
posTable.Columns["discount_percent"].ColumnName = #"Discount %";
POS m_pos = new POS();
m_pos.Data = posTable;
m_pos.totalPayment = totalPayment;
m_pos.CheckOut();
return Json(new
{
Status = "Success"
});
}
catch
{
return Json(new
{
Status = "Fail"
});
}
}
And i attempted wrote this AJAX script to call and submit the parameters to the Controller:(but it didn't work)
var totalPay = 1000;
var GatherPosItems = $('#tblPOS').tableToJSON();
$.ajax({
type: 'POST',
data: JSON.stringify(GatherPosItems)+"&totalPayment="+totalPay,
url: '#Url.Action("CheckOut", "POS")',
dataType: "json",
contentType: 'application/json; charset=utf-8',
success: function (data) {
alert('Success');
},
error: function (req, status, errorObj) {
alert(errorObj.toString());
}
});
The GatherPosItems is a JSON with multiple "Rows" or Objects, so it's an array.
I added a parameter totalPayment.
How can i pass Both GatherPosItems and totalPayment to the Controller?
my Model:
public class POS_model
{
public string Qty { get; set; }
public string description { get; set; }
public string price { get; set; }
public string discount_percent { get; set; }
public string Discount_amount { get; set; }
public string Discounted_price { get; set; }
public string Line_total { get; set; }
public string is_vat { get; set; }
public string track_type { get; set; }
public string item_line_id { get; set; }
public string id { get; set; }
public string sale_code { get; set; }
public string reference { get; set; }
public string unit_of_measure { get; set; }
public string location { get; set; }
public string item_code { get; set; }
}
My GatherPosItems's RESULT:

You concatenate a non-JSON string (&totalPayment="+totalPay) to the JSON returned from JSON.stringify function, which corrupts the format of data being sent to the server and makes the model binder unable to parse it.
The following should work:
$.ajax({
type: 'POST',
data: JSON.stringify({pos: GatherPosItems, totalPayment: totalPay}),
url: '#Url.Action("CheckOut", "POS")',
dataType: "json",
contentType: 'application/json; charset=utf-8',
success: function(data) {
alert('Success');
},
error: function(req, status, errorObj) {
alert(errorObj.toString());
}
});

Ajax not receiving complete JsonResult

Background:
In the view, we ask (via jquery and ajax) the controller for data from the database. The data is returned as Json, but for reasons unknown one part of the Json object is returned as null, even though it is properly set in the controller's JsonResult.
The Code:
The class to be returned as JsonResult
public class InData
{
public InData() { }
public AppsWithActions[] apps { get; set; }
public User[] users { get; set; }
public string timePeriod { get; set; }
public string startDate { get; set; }
public string endDate { get; set; }
public string dataType { get; set; }
}
The Problem is the string arrays actionIds and actionNames in the following class are null in the javascript, even though they have the correct values in the JsonResult:
public class AppsWithActions
{
public AppsWithActions() { }
public string id { get; set; }
public string name { get; set; }
public string[] actionIds { get; set; }
public string[] actionNames { get; set; }
}
The controller function that sets the InData and returns it to the javascript:
//Takes a goal setting, turns it to indata and returns a JsonResult
public JsonResult GetIndataFromGoalSettingId(SettingId settingId)
{
var id = ToGuid(settingId.idString);
GoalSetting setting = Session.Query<GoalSetting>()
.Where(x => x.Id == id)
.FirstOrDefault();
var indata = TransformGoalSettingToInData(setting);
return Json(new { returnvalue = indata }, JsonRequestBehavior.AllowGet);
}
The ajax call that returns everything correct, except the apps.actionIds and apps.actionNames
function getIndataFromGoalSettingId(settingId) {
if (settingId != null) {
settingIdIn = { "idString": settingId};
$.ajax({
type: "POST",
async: false,
traditional: true,
url: 'GetIndataFromGoalSettingId',
data: JSON.stringify(settingIdIn),
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function (result) {
//...
}
});
}
}
It should be said that we have successfully used the same kind of infrastructure for getting data and returning it as Json to the javascript before, but if anyone has a better suggestion feel free to spell it out!